HTML学习日记（盒子模型）
↵
盒子模型
边框
| 属性 | 说明 | 样式值 |
|
border-top-style |
上边框样式 |
none：无边框 solid：实线边框 dashed：虚线边框 dotted：点状边框 double：双线边框 hidden：与none相同，应用于表解决边框冲突 |
|
border-right-style |
右边框样式 |
|
|
border-bottom-style |
下边框样式 |
|
|
border-left-style |
左边框样式 |
|
|
border-style |
设置四个边框样式 |
边框颜色（border-color）
border-top-color、border-right-color、border-bottom-color、border-left-color、border-color
边框粗细（border-width）
border-top-width、border-right-width、border-bottom-width、border-left-width、border-width
边框简写（border）：同时设置边框的颜色、粗细和样式
border-bottom: 9px #F00 dashed ;
border: 9px #F00 solid;
内边距（padding）
padding-left 、padding-right、padding-top、padding-botton、padding
外边距（margin）
margin-top、margin-right、margin-bottom、margin-left、margin
行内元素和块级元素区别
块级元素会独占一行，其宽度自动填满其父元素宽度
行内元素不会独占一行，相邻的行内元素会排列在同一行里，知道一行排不下，才会换行，其宽度随元素的内容而变化
块级元素可以设置 width, height属性，行内元素设置width, height无效
块级元素可以设置margin 和 padding
标准文档流的组成
块级元素：<h1>…<h6>、<p>、<div>、列表......
内联元素:<span>、<a>、<img/>、<strong>......