css的三大特性和盒子模型

css-三大特性 

1）css层叠性

样式一样 使用最近原则

    样式不同不会层叠

2）继承性

子承父业（继承text- font- line-和color属性）

3）css优先级

！important>行内>id>类名>标签>通配符>继承

 

---

盒子模型

css的三大模块：盒子模型，浮动，定位

盒子模型由内边距（padding） 边框（borer） 外边距（margin）组成；

上边框 border-top-width（宽度）{style（样式） color（颜色）}----------border-top：宽度 样式 颜色；

下边框 border-bottom-width（宽度）{style（样式） color（颜色）}----------border-bottom：宽度 样式 颜色；

左边框 border-left-width（宽度）{style（样式） color（颜色）}----------border-left：宽度 样式 颜色；

右边框 border-right-width（宽度）{style（样式） color（颜色）}----------border-right：宽度 样式 颜色；

综合设置 border-style：上边（右边 下边 左边）；{none 无 solid实线  dashed虚线 dotted 点状线   doubie双实线}

表格细线边框---border-collapse：collapse 合并相邻边框

---

盒子内外边距

内边距-padding（top上 bottom下 right右 left左）

外边距-margin（top上 bottom下 right右 left左）

外边盒子剧中（盒子必须指定了宽度，左右边距都设为auto 可以实现水平居中）

内容居中和盒子居中

文字水平居中-text-align：center

盒子居中：margin：auto

相邻快元素垂直外边距合并

使用margin定义元素块才会居中-当上下两块元素相遇时margin：bottom和margin：top则会合并