Summary of experience in using div box model

Calculation of the box model <br />Margin + border + padding + content

The width and height in CSS only set the height and width of the content area. Not the height and width of the entire model.

Copy code

The code is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>demo</title>
<style type="text/css">
*{margin:0; padding:0;}
dl { background:red;border:10px solid #000; width:100px; height:100px;}
dt { background:yellow;}
dd { background:green;}
</style>
</head>
<body>
<dl>
<dt>test of dt</dt>
<dd>test of dd</dd>
</dl>
</body>
</html>

Setting margins and padding will not affect the height and width of the content area, but only change the height and width of the secondary box model area.

When the box models are nested, the inner box model will affect the outer box model.

CSS3 implements horizontal centering, vertical centering, horizontal and vertical centering example code

Blog

Summary of experience in using div box model

CSS3 implements horizontal centering, vertical centering, horizontal and vertical centering example code

How to use mysqldump for full and point-in-time backups

Sample code for configuring nginx to support https

js implements a simple countdown

Nest.js authorization verification method example

A simple way to achieve scrolling effect with HTML tag marquee (must read)

Web standards learning to understand the separation of structure and presentation

Solution to PHP not being able to be parsed after nginx installation is complete

How to install docker using YUM

How to implement checkbox & radio alignment

Recommend

How to create LVM for XFS file system in Ubuntu

Linux system opens ports 3306, 8080, etc. to the outside world, detailed explanation of firewall settings

Five ways to implement inheritance in js

mysql 5.7.23 winx64 decompression version installation tutorial

How to implement h5 input box prompt + normal text box prompt

The whole process of installing and configuring Harbor1.7 on CentOS7.5

Detailed steps to install web server using Apache httpd2.4.37 on centos8

How to configure tomcat server for eclipse and IDEA

What are the rules for context in JavaScript functions?

Implementation of Nginx configuration and access to local static resources in Mac environment

How to create a swap partition file in Linux

How to use pdf.js to preview pdf files in Vue

Summary of MySQL date and time functions (MySQL 5.X)

Details on using regular expressions in MySQL

Detailed explanation of Tomcat's commonly used filters