HTML（四）解決行內元素 行內塊元素中間空隙

會出現間隙的原因，其實是行內標籤元素、行內塊元素之間的換行帶來的影響，這個距離是字型大小的1/3倍。只要解決了換行的問題，也就解決了間隙的問題。

="box"

>
你好<
/span>
你好<
/span>
你好<
/span>
<
/div>

="box"

>
你好<
/span
>
你好<
/span
>
你好<
/span>
<
/div>

="box"

>
你好<
/span>
<
!-- 消除空格 
-->
你好<
/span>
<
!-- 消除空格 
-->
你好<
/span>
<
/div>

.box span
<
/style>
="box"
>
你好<
/span>
你好<
/span>
你好<
/span>
<
/div>
<
/body>

.box
.box>span
<
/style>
="box"
>
你好<
/span>
你好<
/span>
你好<
/span>
<
/div>
<
/body>

我們還可以通過letter-spacing改變行內元素之間空隙的大小，將letter-spacing設為-0.333333em即可。但是與font-size一樣，改變letter-spacing時會改變內部子元素的間隙，需要在子元素內手動進行矯正。

.box
.box>span
<
/style>
="box"
>
你好<
/span>
你好<
/span>
你好<
/span>
<
/div>
<
/body>

塊元素 行內元素 行內塊元素

塊級元素 一行只能放乙個，可以設定寬度高度，預設為容器的100 可以包含任何標籤 常用元素 div hr p h1 h6 ul ol dl form table 行內元素 一行可以放多個行內元素，不可以直接設定寬度高度，預設為本身內容的寬度，容納文字或其他行內元素 常用元素 span a i em ...

塊級元素，行內元素，行內塊元素

內聯元素 行內元素 內聯元素 inline element 行內塊元素 a 錨點 abbr 縮寫 acronym 首字 b 粗體 不推薦 bdo bidi override big 大字型 br 換行 cite 引用 code 計算機 在引用原始碼的時候需要 dfn 定義字段 em 強調 font ...

塊級元素，行內元素，行內塊元素

獨佔一行，對寬高的屬性值生效 如果不給寬度，預設為瀏覽器的寬度即100 塊標籤 p div ul ol li dl dt dd h1 h6 form 可以多個標籤存在一行，對寬高的屬性值不生效，靠內容撐開 行內標籤 a span em strong b i u label br 結合行內和塊級元素的...