css盒子模型用于处理元素的内容、内边距、边框和外边距的方式简称。css盒子模型到底的思想是什么？CSS盒子模型对行内元素和块级元素的区别和特点，Box-sizing的使用。
* {
margin: 0;
padding: 0;
}
css盒子模型到底的思想是什么？
标准盒模型：元素的width和height = content //内容
IE盒模型：元素的width和height =content+border+padding //内容+边框+内边距
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
CSS盒子模型对行内元素和块级元素的区别和特点
块级元素可以设置width,height属性。
行内元素设置width,height属性无效，它的长度高度主要根据内容决定。
块级元素即使设置了宽度,仍然是独占一行。
块级元素可以设置margin和padding属性。
行内元素的margin和padding属性,水平方向的padding-left,padding-right,margin-left,margin- right都产生边距效果,但竖直方向的padding-top,padding-bottom,margin-top,margin-bottom却不会产生边距效果。
块级元素对应于display:block.
行内元素对应于display:inline。
行内元素(内联元素)：a
, span, strong, em, br, img , input, label, select, textarea, cite....
Box-sizing说明
W3C标准盒模型，默认属性。padding和border不被包含在定义的width和height之内。
.demo {
width: 100px;
height: 100px;
padding: 10px;
border: 5px solid black;
box-sizing: border-box; /*增*/
}
Box-sizing 的应用场景？
服务热线 19970861797
