盒子模型

 

 每一个可见的 HTML 元素都是一个盒子

 盒子模型从外到内分别是 margin border padding content 

盒子模型的属性：box-sizing box-sizing:content-box 时是标准盒子模型；box-sizing:border-box 时是IE 盒子模型；inherit 规定从父元素继承 box-sizing 属性

当 margin/padding 属性后只跟一个值--上下左右；两个值--上下 左右；三个值：上 左右 下；四个值：上 右 下 左

border-style 属性

　　none：无边框

　　hidden：与 none 相同 但是用于表时解决边框冲突

　　dotted：点状边框

　　dashed：虚线

　　solid：实线

　　double：双线

　　groove：3D 凹槽

　　inherit：继承父元素边框

盒子阴影（CSS3 新增属性）box-shadow

正规语法：none | [inset? && [ <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? ] ]#

　　inset：默认阴影在边框外 如果使用 inset 阴影在边框内

　　offset-x, offset-y：阴影偏移量；offset-x 值为正向右偏，为负向左偏；offset-y 是垂直偏移量，为负阴影在元素下

　　blur-radius：值越大阴影模糊面积越大 阴影模糊越淡 不可为负

　　spread-radius：正值 阴影扩大，负值 阴影收缩

　　color：颜色

设置多个阴影时用逗号隔开