css盒子模型的理解

所谓盒子模型就是把HTML页面的元素看作一个矩形盒子,也将就是盛装内容的容器,每个矩形都市元素的内容,内边距(padding

),边框(border),和外边距(margin)组成.

border-style的属性值

     none:没有边框属性值              solid:边框为单实线(最常用)

     dashed:边框为虚线                   dotted:边框为点线                     double:边框为双实线

 

boder-radio:设置边框的圆角半径

边框综合 设置  border:四边框的宽度   四变宽的样式  四边框颜色

内边距(padding)

padding属性用于设置内边距,是指边框与内容之间的距离

padding:第一个值  第二个值  第三个值   第四个值                     这四个值分别表示  上左下右  顺时针排序,只有两个值得时候表示上下,左右  三个值得时候,第一个值是上,第二个值 是左右,第三个值是下

外边距  margin属性用于设置外边距,属性值的使用同padding

外边距实现盒子的居中

必须满足以下两个条件:1,必须是块级元素.   2,盒子必指定宽度(width)  然后给左右的外边距都设置为auto,可以使盒子中元素水平居中

 

 

外边距塌陷