元素顯示模式就是元素（標籤）以什麼方式進行顯示，HTML 元素一般分為塊元素和行內元素兩種型別。

1.塊元素

　　常見的塊元素有<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等，其中 <div> 標籤是最典型的塊元素。 　　塊級元素的特點： 　　　　(1) 比較霸道，自己獨佔一行。 　　　　(2)高度，寬度、外邊距以及內邊距都可以控制。 　　　　(3) 寬度預設是容器（父級寬度）的100%。 　　　　(4) 是一個容器及盒子，裡面可以放行內或者塊級元素。 　　注意： 　　　　文字類的元素內不能使用塊級元素。 　　　　<p> 標籤主要用於存放文字，因此 <p> 裡面不能放塊級元素，特別是不能放<div>。 　　　　同理， <h1>~<h6>等都是文字類塊級標籤，裡面也不能放其他塊級元素。   2.行內元素 　　常見的行內元素有 <a>、<strong>、<b>、<em>、<i>、<del>、<s>、<ins>、<u>、<span>等，其中<span> 標籤是最典型的行內元素。也將行內元素稱為內聯元素。 　　行內元素的特點：    　　 (1)相鄰行內元素在一行上，一行可以顯示多個。     　　(2)高、寬直接設定是無效的。   　　  (3)預設寬度就是它本身內容的寬度。    　　 (4)行內元素只能容納文字或其他行內元素。 　　注意： 　　　　連結裡面不能再放連結。 　　　　特殊情況連結 裡面可以放塊級元素，但是給 轉換一下塊級模式最安全。
  3.行內塊元素 　　在行內元素中有幾個特殊的標籤 —— <img />、<input />、<td>，它們同時具有塊元素和行內元素的特點。 　　行內塊元素的特點： 　　　　(1)和相鄰行內元素（行內塊）在一行上，但是他們之間會有空白縫隙。一行可以顯示多個（行內元素特點）。 　　　　(2)預設寬度就是它本身內容的寬度（行內元素特點）。 　　　　(3)高度，行高、外邊距以及內邊距都可以控制（塊級元素特點）。    

 4.元素顯示模式轉換

　　特殊情況下，我們需要元素模式的轉換，簡單理解為一個模式的元素需要另外一種模式的特性，比如想要增加連結 的觸發範圍。

　　　　轉換為塊元素：display:block;

　　　　轉換為行內元素：display:inline;

　　　　轉換為行內塊：display: inline-block;