css盒子模型相关

块级元素与行内元素

块级元素(占一行)：div、dl、form、h1 – h6、hr、ol、p、pre、table、ul；
行内元素(一行显示)：a、br、img、input、label、q、select、span、strong、textarea；
可以通过display属性来进行转换
display：inline将元素显示为内联元素，元素前后没有换行符
行内元素无法设置宽和高，外边距只能设置左右的，无法设置上下的

可以设置高度的元素

HTML中可以设置宽度和高度的元素有块级元素和替换元素，行内元素无法设置宽和高；span标签属于行内元素，无法设置宽和高，只能由元素内的内容撑开，元素内有多少个字，元素就有多宽，无法设置宽和高；

边框border

边框样式的值

double定义双线边框

dotted定义点状边框

dashed定义虚线边框

solid定义实线边框

边框的样式设置有：border-style边框样式，border-width边框宽度，border-color边框颜色。

盒子模型在页面中的实际高度问题

盒子的实际宽度是：左边框+左内边距+内容宽度+右内边距+右边框；
盒子在页面中所占据的宽度是：左外边距+左边框+左内边距+内容宽度+右内边距+右边框+右外边距；
注意一个是实际高度，一个是实际占据高度。