CSS学习笔记之框模型

      最近在学习前端页面的东西，做下笔记，加深一下印象。

css框模型

1.border 边框
每个边框有 3 个方面：宽度、样式，以及颜色
样式：border-style 可以接受四个值
dotted（点线边框）、solid（实线边框）、dashed(虚线边框)、double（双线边框）
设置单独样式为 border-top（上边框）、border-bottom（下边框）、border-left（左边框）、border-right（右边框）

宽度：border-width 可以接受四个值
thin（细边框）、medium（中等边框）、thick（粗边框）
单独的宽度：border-top-width（上边框宽度）、border-bottom-width（下边框宽度）、border-left-width（左边框宽度）、border-right-right（右边框宽度）

颜色：border-color 可以接受四个值
注：如果接受的值有缺省的话，就进行值赋值，比如一个值则是上、右、下、左都用这个属性，两个值，则是上、下用第一个值，右、左用第二个值；三个值，上为第一个，右左为第二个值，下为第三个值。

2.margin 外边距 可以接受四个值，同样符合上面的值复制
单独的外边距 margin-top（上外边距）、margin-right（右外边距）、margin-bottom（下外边距）、margin-left（左外边距）
margin可以接受任何长度单位，可以是像素、英寸、毫米、em或者auto

3.padding 内边距 同样可以接受四个值，也符合上面的值复制规则
单独的外边距 padding-top（上外边距）、padding-right（右外边距）、padding-bottom（下外边距）、padding-left（左外边距）
margin接受长度值或百分比值。

4.外边距合并
外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。
合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。
注释：只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。