饥人谷技术博客

盒模型

2016-08-22  本文已影响0人  饥人谷_吴亚敏
盒模型包括哪些属性?

盒模型包括:margin、border、padding、content。

text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中?

让块级元素内的行内元素水平居中显示。

如果遇到一个属性想知道兼容性,在哪查看?

Can I use

IE 盒模型和W3C盒模型有什么区别?

IE的盒模型与W3C盒模型的区别在与width的计算。

盒模型图解

W3C 盒子模型的范围包括 margin、border、padding、content,并且 content 部分不包含其他部分。
IE 盒子模型的范围也包括 margin、border、padding、content,和标准 W3C 盒子模型不同的是:IE 盒子模型的 content 部分包含了 border 和 pading。

以下代码的作用?兼容性?
*{ box-sizing: border-box;}

以上代码设置了所有元素的内边距和边框都将在已设定的宽度和高度内进行绘制。
设置他以后,border和padding全会在你设置的宽度内部,比如手机端设置两行并列的布局,宽度各为50%,如果不用这个属性,设置border后右边的div会下来错位,设置这个属性,宽度还是50%而不是50%+*px,两行可以并列显示。

兼容性
 
 
 
 
本教程版权归作者和饥人谷所有,转载须说明来源!
上一篇下一篇

猜你喜欢

热点阅读