CSS 标准文档流

CSS标准文档流

文档流指元素排版布局过程中，元素会默认从左往右，从上往下的排列方式。

文档流可分为：块元素、行内元素。

块元素

块元素的特点：

• 块元素独占一行。
• 高度、宽度、内外边距都可以控制。
• 宽度默认为父容器的100%。
• 里面可以放行内和块元素。

注意：

• 文字类的元素内不能使用块元素。
• <p>标签主要用于存放文字，不能放块元素。

行内元素

行内元素的特点：

• 相邻行内元素在一行上，一行可以显示多个。
• 宽高不能设置。
• 默认宽度是其本身内容的宽度。
• 行内元素只能容纳文本或行内元素。

注意：

• <a>里面不能放<a>。
• <a>里买呢可以放块元素，但是将<a>转为块元素最安全。

行内块元素

行内块元素的特点：

• 行内块元素同时具有块元素和行内元素的特点。
• 和相邻的行内元素（行内块）在一行上，但它们之间有空白缝隙。一行可以显示多个行内元素（行内元素特点）。
• 默认宽度是其本身内容的宽度（行内元素特点）。
• 高度、宽度、内外边距都可以控制（块元素特点）。

块元素：
<h1>~<h6> <p> <div> <ul> <ol> <li>

行内元素：
<a> <strong> <b> <em> <i> <del> <s> <ins> <u> <span>

行内块元素：
<img> <input> <td>