HTML可以將元素分類方式分為內聯(行內)元素、塊級(塊狀)元素和行內塊元素三種。

注：HTML是標簽語言，那么既然是標簽，就可以自己定義一些自己元素(如自定義的元素等)，自定義元素瀏覽器默認解析為內聯元素，為防止不同瀏覽器解析不同的問題，建議通過css的display屬性來規定自定義元素的屬性。相信使用過UI框架的朋友，會看到一些html手冊以外的一些元素，其實這些都是一些自定義的元素。

首先需要說明的是，這三者是可以互相轉換的，使用css的display屬性能夠將三者任意轉換：

CSS display 屬性

屬性值

值

描述

none

此元素不會被顯示。

block

此元素將顯示為塊級元素，此元素前后會帶有換行符。

inline

默認。此元素會被顯示為內聯元素，元素前后沒有換行符。

inline-block

行內塊元素。(CSS2.1 新增的值)

list-item

此元素會作為列表顯示。

run-in

此元素會根據上下文作為塊級元素或內聯元素顯示。

compact

CSS 中有值 compact，不過由于缺乏廣泛支持，已經從 CSS2.1 中刪除。

marker

CSS 中有值 marker，不過由于缺乏廣泛支持，已經從 CSS2.1 中刪除。

table

此元素會作為塊級表格來顯示(類似

inline-table

此元素會作為內聯表格來顯示(類似

table-row-group

此元素會作為一個或多個行的分組來顯示(類似

)。

table-header-group

此元素會作為一個或多個行的分組來顯示(類似 )。

table-footer-group

此元素會作為一個或多個行的分組來顯示(類似

)。

table-row

此元素會作為一個表格行顯示(類似

)。

table-column-group

此元素會作為一個或多個列的分組來顯示(類似

)。

table-column

此元素會作為一個單元格列顯示(類似

)

table-cell

此元素會作為一個表格單元格顯示(類似

和 )

table-caption

此元素會作為一個表格標題顯示(類似

)

inherit

規定應該從父元素繼承 display 屬性的值。

例：

p {

display: inline

}

div {

display: none

}

本例中的樣式表把段落元素設置為內聯元素。

而 div 元素不會顯示出來！

div 元素的內容不會顯示出來！

顯示結果：

1.內聯(行內)元素

行內元素最常使用的就是span，其他的只在特定功能下使用，修飾字體和標簽，還有_{和^{這兩個標簽可以直接做出平方的效果，而不需要類似移動屬性的幫助，很實用。}}

行內元素特征：(1)設置寬高無效

(2)對margin僅設置左右方向有效，上下無效；padding設置上下左右都有效，即會撐大空間

(3)不會自動進行換行

2.塊級(塊狀)元素

塊狀元素代表性的就是div，其他如p、nav、aside、header、footer、section、article、ul-li、address等等，都可以用div來實現。不過為了可以方便程序員解讀代碼，一般都會使用特定的語義化標簽，使得代碼可讀性強，且便于查錯。

塊狀元素特征：(1)能夠識別寬高

(2)margin和padding的上下左右均對其有效

(3)可以自動換行

(4)多個塊狀元素標簽寫在一起，默認排列方式為從上至下

3.行內塊元素

行內塊狀元素綜合了行內元素和塊狀元素的特性，但是各有取舍。因此行內塊狀元素在日常的使用中，由于其特性，使用的次數也比較多。

行內塊狀元素特征：(1)不自動換行

(2)能夠識別寬高

(3)默認排列方式為從左到右

4.同一類型的元素，到底該用哪個。

其實同一類型的元素，屬性是一樣的，顯示出的效果也一樣，用哪個都可以。可是為了代碼的可讀性，規范化，建議特定的場景用特定的元素。

比如：盒子容器用div，文字段落用p，反過來效果一樣，但不符合規范。

塊級元素和行內元素的分類

html中的塊級元素：

標簽

描述

定義地址。

定義文章。

定義頁面內容之外的內容。

定義聲音內容。

定義長的引用。

定義圖形。

定義表格標題。

定義定義列表中項目的描述。

定義文檔中的節。

定義定義列表。

定義定義列表中的項目。

定義元素的細節。

定義圍繞表單中元素的邊框。

定義 figure 元素的標題。

定義媒介內容的分組，以及它們的標題。

定義 section 或 page 的頁腳。

定義供用戶輸入的 HTML 表單。

to

定義 HTML 標題。

定義 section 或 page 的頁眉。

---

定義水平線。

定義 fieldset 元素的標題。

定義列表的項目。

定義命令的列表或菜單。

定義預定義范圍內的度量。

定義導航鏈接。

定義針對不支持框架的用戶的替代內容。

定義針對不支持客戶端腳本的用戶的替代內容。

定義有序列表。

定義輸出的一些類型。

定義段落。

定義預格式文本。

定義 section。

定義表格。

定義表格中的主體內容。

定義表格中的單元。

定義表格中的表注內容(腳注)。

定義表格中的表頭單元格。

定義表格中的表頭內容。

定義日期/時間。

定義表格中的行。

定義無序列表。

html中的行內元素：

標簽

描述

定義錨。

定義縮寫。

定義只取首字母的縮寫。

定義粗體字

定義文字方向。

定義大號文本。

定義簡單的折行。

定義按鈕 (push button)。

定義引用(citation)。

定義計算機代碼文本。

定義命令按鈕。

定義定義項目。

定義被刪除文本。

定義強調文本。

定義外部交互內容或插件。

定義斜體字。

定義圖像。

定義輸入控件。

定義鍵盤文本。

定義 input 元素的標注。

定義圖像映射。

定義有記號的文本。

定義內嵌對象。

定義任何類型的任務的進度。

定義短的引用。

定義計算機代碼樣本。

定義選擇列表(下拉列表)。

定義小號文本。

定義文檔中的節。

定義強調文本。

定義下標文本。

定義上標文本。

定義多行的文本輸入控件。

定義日期/時間。

定義打字機文本。

定義文本的變量部分。

定義視頻。

定義可能的換行符。

注：當你不知道某一元素為什么屬性時，可通過F12調用瀏覽器調試器查看

圖例：

總結

以上是生活随笔為你收集整理的html 指定对象为块元素,html内联（行内）元素、块级（块状）元素和行内块元素分类...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。