CSS3与页面布局学习总结（二）——Box Model、边距折叠、内联与块标签、CSSReset

发布时间：2016-11-29 09:01:23

一、盒子模型（Box Model）盒子模型也有人称为框模型，HTML中的多数元素都会在浏览器中生成一个矩形的区域，每个区域包含四个组成部分，从外向内依次是：外边距（Margin）、边框（Border）、内边距（Padding）和内容（Content），其实盒子模型有两种，分别是 ...

一、盒子模型（Box Model）

盒子模型也有人称为框模型，HTML中的多数元素都会在浏览器中生成一个矩形的区域，每个区域包含四个组成部分，从外向内依次是：外边距（Margin）、边框（Border）、内边距（Padding）和内容（Content），其实盒子模型有两种，分别是 ie 盒子模型和标准 w3c 盒子模型，加上了doctype声明，让所有浏览器都会采用标准 w3c 盒子模型去解释你的盒子。当设置一个元素的样式如下：

<!DOCTYPE html><html>  <head>    <meta charset="UTF-8">    <title>盒子模型</title>    <style type="text/css">      #box{        width: 100px;        height: 100px;        margin: 20px;        padding: 20px;        border: 10px solid blue;      }    </style>  </head>  <body>    <div id="box">      Box Model    </div>  </body></html>

View Code

海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理：https://www.xlkjsw.com