在 CSS 盒子模型中, 我们提到了 html 元素中的块元素 (block element) 和内联元素(inline element). 那么它们究竟是什么呢?
其实, 这两种元素都是 HTML 规范中的概念.
块元素 (block element) 一般是其他元素的容器元素, 能容纳其他块元素或内联元素. 最常见的就是 P 和 div 这两个, 说的简单点, 块元素就好比一个四方块, 可以放其他的四方块, 并可以呈现在页面上任何地方. 默认情况下块元素, 是独占一行的.
常见的块元素: div,h1-h6 标题, form(只能用来容纳其他块元素),hr,p,table,ul,ol 等.
内联元素 (inline element) 也叫内嵌元素或行内元素, 一般都是基于语义级 (semantic) 的基本元素. 内联元素只能容纳文本或者其他内联元素, 常见内联元素有 a 和 span.
块元素与内联元素的区别?
1, 块元素, 总是在新行上开始; 内联元素, 和其他元素都在一行上.
2, 块元素, 能容纳其他块元素或内联元素; 内联元素, 只能容纳文本或者其他内联元素.
3, 块元素中高度, 行高以及顶和底边距都可控制; 内联元素中高, 行高及顶和底边距不可改变.
(这上面的区别, 指的是默认情况下的, 不包括 CSS 的刻意控制. 也就是说当使用 CSS 控制时, 块元素和内联元素的属性差异会越来越小.)
block(块)元素的特点:
1总是在新行上开始;
2高度, 行高以及外边距和内边距都可控制;
3宽度缺省是它的容器的 100%, 除非设定一个宽度;
4它可以容纳内联元素和其他块元素.
inline 元素的特点:
1和其他元素都在一行上;
2高, 行高及外边距和内边距不可改变;
3宽度就是它的文字或图片的宽度, 不可改变;
4内联元素只能容纳文本或者其他内联元素.
来源: http://www.css88.com/qa/css3/13400.html