块级元素的特性:
(1) display属性为block
(2) 总是在新行上开始(float除外)
(3) 高度,行高以及顶和底边距都可以控制
(4) 宽度缺省值为容器的width的100%
常见标签:<div>、<p>、<form>、<ul>、<li>
行内元素的特性:
(1) display属性为inline
(2) 总是显示在一行
(3) 与块级元素相对,高度,行高以及顶和底边距都不可以控制
(4) 宽度就是其文字或者图片的宽度,不可改变
常见标签:<span>、<a>、<img>、<label>、<strong>、<em>
inline 和 block可以控制一个元素的行宽高等特性,需要切换的情况如下:
(1) 让一个inline元素从新行开始
(2) 让一个block元素与其他元素在一行
(3) 控制inline的宽度和高度
(4) 无需设置宽度为block元素设定与背景同宽的背景色
inline-block元素的特点:
将对象呈inline对象,但是对象的内容呈block显示,旁边的内联对象会被呈递在同一行内,允许空格。(准确地说,应用此特性的元素呈现为内联对象,周围元素保持在
同 一 行,但可以设置宽度和高度地块元素的属性)
IE触发inline-block的方式
(1) 先使用display:inline-block,再使用display:inline;
(2) 先让block元素display:inline,然后再触发haslayou,比如zoom:1;