HTML 塊級元素與行內元素
每個 HTML 元素都有一個預設的顯示值，具體取決於它是哪種型別的元素。
最常見的兩種顯示值是塊級（block）和行內（inline）。
塊級元素
塊級元素總是從新行開始，瀏覽器會在元素前後自動新增一些空間（外邊距）。
塊級元素總是佔據所有可用寬度（儘可能向左和向右延伸）。
兩個常用的塊級元素是：<p> 和 <div>。
<p> 元素在 HTML 文件中定義一個段落。
<div> 元素在 HTML 文件中定義一個分割槽或節。
<p> 元素是一個塊級元素。
<div> 元素是一個塊級元素。
以下是 HTML 中的塊級元素
行內元素
行內元素不會從新行開始。
行內元素只佔據必要的寬度。
這是一個段落內部的 <span> 元素。
以下是 HTML 中的行內元素
注意：行內元素不能包含塊級元素！
<div> 元素
<div> 元素通常用作其他 HTML 元素的容器。
<div> 元素沒有必需的屬性，但 style、class 和 id 是常見的。
與 CSS 結合使用時，<div> 元素可用於為內容塊設定樣式。
示例
<div style="background-color:black;color:white;padding:20px;">
<h2>倫敦</h2>
<p>倫敦是英格蘭的首都。它是英國人口最多的城市，都市區有超過 1300 萬居民。</p>
</div>
自己動手試一試 »
您將在下一章中瞭解更多關於 <div> 元素的資訊。
<span> 元素
<span> 元素是一個行內容器，用於標記文字的一部分或文件的一部分。
<span> 元素沒有必需的屬性，但 style、class 和 id 是常見的。
與 CSS 結合使用時，<span> 元素可用於為文字部分設定樣式。
示例
<p>我媽媽有一雙<span style="color:blue;font-weight:bold;">藍色的</span>眼睛，我爸爸有一雙<span style="color:darkolivegreen;font-weight:bold;">深綠色的</span>眼睛。</p>
自己動手試一試 »
Chapter Summary
- 塊級元素總是從新行開始，並佔據所有可用寬度
- 行內元素不會從新行開始，並且只佔據必要的寬度
<div>元素是塊級元素，通常用作其他 HTML 元素的容器<span>元素是一個行內容器，用於標記文字的一部分或文件的一部分
HTML 標籤
| 標籤 | 描述 |
|---|---|
| <div> | 定義文件中的一個節（塊級） |
| <span> | 定義文件中的一個節（行內） |
有關所有可用 HTML 標籤的完整列表，請訪問我們的 HTML 標籤參考。
影片：HTML 塊級與行內
