块级元素（block）、行内元素（inline）

2016-10-17 本文已影响0人黄露hl

块级元素占用空间是一整行，行内元素占用空间是它自身的内容宽度。行内元素可以一并排显示，块级元素不能。
块级元素：div、p、h1、table、ul、ol、dl、dt、form等
行内元素：a、span、img、input、button、em、textare等
块级元素可以设置宽高等属性，width、height、padding、text-align、margin等。width和height针对块级元素里面的内容所占空间。而对于行内元素设置宽、高是无效的，行内元素的宽高由它自身的大小决定，设置padding和margin只有左右有效，上下也无效。行内元素可以用行高line-height代替height就可以设置它所占的高度，也可以采用display：inline-block，inline-block就是可以使该元素既有block的宽高特性，又有inline的同行特性，可以设置所占的高度也能同行显示。可通过浏览器审查元素看到它们的区别。需要注意的是IE8以下的版本不支持inline-block。