HTML+CSS 元素的显示模式

什么是元素显示模式

在了解元素显示模式前，我们先来举个不恰当的例子：比如在世界上的人有成万上亿，那么归根结底只有两种人就是男人和女人，偶尔还有可能有第三种人-人妖。无论是男人还是女人甚至人妖，虽然都是人但是不同的人也有着不同的特点或者说不同的分工。

其实在HTML中也跟我们人类相似，html中同样也有多种多样的元素标签，但归根结底可以分为两大类：块元素和行内元素。而不同的元素又有着不同的特点和作用，了解了它们的特点我们就可以很好的对网页进行布局。

谈到了网页的布局其实就涉及到了元素的显示模式。html中有那么多元素并且在一般情况下又分为了块元素和行内元素，而这些元素在网页中的显示方式就是元素的显示模式。比如div要自己独占一行，而span在同一行中就可以放置多个。

上面说HTML元素分为块元素和行内元素，那么哪些是块元素哪些是行内元素，它们又有什么特点呢，接下来我们逐一分析：

块元素（男人）

常用的块元素有

~

、

、

、

、
、
• 等，其中
  是最典型的块元素

  块元素的特点：

  1. 比较霸道，独占一行
  2. 可以设置宽度、高度、内边距和外边距
  3. 宽度默认是容器（父级元素宽度）的100%
  4. 是一个容器及盒子，里面可