CSS总结——标签显示模式display

标签显示模式就是标签以什么方式在网页中进行显示。标签显示模式的作用就是对标签进行分类，可以更好的完成网页的布局。

块级元素block

常见的块级元素有<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等。
块级元素的特点：
1、独占一行。
2、高度，宽度，内外边距都可以设置。
3、默认宽度是容器或者父级宽度的100%。
4、是一个容器及盒子，里面可以放行内或者块级元素。但是文字类的块级标签不能放其他块级元素。

行内元素inline

常见的行内元素有`<a>,<strong>,<b>,<em>,<i>,<del>,<span>等`
行内元素的特点：
1、相邻行内元素在一行上，一行可以显示多个。
2、直接设置宽高是无效的。
3、默认的宽度就是内容本事的宽度。
4、**行内元素只能容纳文本或者其他行内元素。**

行内块元素inline-block

常见的行内块元素有<img/>,<input/>,<td>。可以对它们设置宽高和对齐属性。
行内块元素的特点：
1、和相邻行内元素（行内块）在一行上,但是之间会有空白缝隙。一行可以显示多个。
2、默认宽度就是它本身内容的宽度。
3、高度，行高、外边距以及内边距都可以控制。

标签显示模式转换

• 块级转行内：display:inline;
• 行内转块级：display：block；
• 转行内块：display：inline-block；