HTML+CSS第十二章——块元素，行元素以及行块元素

块元素

①独占一行
②可以设置margin ,padding
③下图可以看到：不设置width的情况下，子容器和父容器的宽度一样，高度是可以包含内容的高度

行元素

行元素不像块元素那样独占一行，而是挨着有序排列
看下图代码了解：①行元素默认的width，height是刚好包含内容(并且高度宽度不可更改)
②可以设置margin-left,right,设置的margin-top,bottom无效，可以设置padding的left，right,而padding的top，bottom看似占了空间，实质是不论是设置多大的px都不占空间的

内联块元素

继承了行元素在同一行排列的特点，其它的继承的就是块级元素的特点了

三类元素之间的转化

想转化为块级元素：display:block
想转化为行级元素：display:inline
想转化为内联块元素：display:inline-block

盒子模型

（1）边框border
div{
boder:2px solid red /宽度 实线 颜色/
}
dashed(虚线 ) dotted（点线）
也可以只设置一个方向p{borfer: solid 2px dashed}

(2)div的填充
div{
margin:1px 5px 4px 2px(上右下左)
margin:5px 4px;(上下)（左右）
margin:5px;(上下左右)
}
padding的是一个道理