行內元素和塊級元素的區別

2021-06-25 18:08:27 字數 1554 閱讀 5773

whyboy站長用例項**講述行內元素和塊級元素最直觀的區別,而他們還擁有很多各自的特性。我們在實習運用中會經常遇見問題,但是如果我們搞清楚了他們的關係和特性,問題就迎刃而解了。

以圖例來表述行內元素和塊級元素的區別會更加直觀:

注:行內元素會再一條直線上,是在同一行的。我是行內元素span標籤我是行內元素strong標籤

注:塊級元素各佔一行。是垂直方向的!

我是塊級元素div標籤

我是塊級元素p標籤

如果你要將行內元素變成塊級元素,那麼就只需要在該標籤上加上樣式 display:block; 這裡已經牽涉到了css內容。塊級元素可以用樣式控制其高、寬的值。

行內元素不可以控制寬和高,除非你想將它轉變成為塊級元素。它的寬和高,是隨標籤裡的內容而變化。

然後whyboy站長羅列了,所有行內元素和塊級元素標籤,做好筆記哦!

塊級元素列表

定義位址

定義**標題

定義列表中定義條目

定義文件中的分割槽或節

定義列表

定義列表中的專案

定義乙個框架集

建立 html 表單

定義最大的標題

定義副標題

定義標題

定義標題

定義標題

定義最小的標題

建立一條水平線

元素為 fieldset 元素定義標題

標籤定義列表專案

為那些不支援框架的瀏覽器顯示文字,於 frameset 元素內部

定義在指令碼未被執行時的替代內容

定義有序列表

定義無序列表

標籤定義段落

定義預格式化的文字

標籤定義 html **

標籤**主體(正文)

**中的標準單元格

定義**的頁尾(腳注或表注)

定義表頭單元格

標籤定義**的表頭

定義**中的行

行內元素列表

標籤可定義錨

表示乙個縮寫形式

定義只取首字母縮寫

字型加粗

可覆蓋預設的文字方向

大號字型加粗

換行引用進行定義

定義計算機**文字

定義乙個定義專案

定義為強調的內容

斜體文字效果

向網頁中嵌入一幅影象

輸入框定義鍵盤文字

標籤為 input 元素定義標註(標記)

定義短的引用

定義樣本文字

建立單選或多選選單

呈現小號字型效果

組合文件中的行內元素

語氣更強的強調的內容

定義下標文字

定義上標文字

多行的文字輸入控制項

打字機或者等寬的文字效果

定義變數

可變元素素列表--可變元素為根據上下文語境決定該元素為塊元素或者內聯元素 按鈕

定義文件中已被刪除的文字

建立包含另外乙個文件的內聯框架(即行內框架)

標籤定義已經被插入文件中的文字

客戶端影象對映(即熱區)

object物件

客戶端指令碼

塊級元素和行內元素區別 以及行內塊元素

塊級元素的特點 1 寬度預設是容器的100 2 高度,行高 外邊距以及內邊距都可以控制。3 總是從新行開始 4 可以容納內聯元素和其他塊元素。行內元素的特點 1 預設寬度就是它本身內容的寬度。2 高 寬無效,但水平方向的padding和margin可以設定,垂直方向的無效。3 和相鄰行內元素在一行上...

行內元素 塊級元素和行內塊級元素

而標籤的屬性是可以轉換的 display inline 轉換為行內元素 display linline block 轉換為行內塊元素 display block 轉換為塊級元素。行內元素 無法設定寬高 margin和padding上下無效,只有左右有效果 總是和相鄰的行內元素在同一行上,預設排列方式...

行內元素和塊級元素區別

引言 一次偶然的面試遇到的題目,雖然當時知道塊級元素和行內元素的區別,但是沒有仔細去想。一 行內元素與塊級元素 塊級元素列表 定義位址 定義 標題 定義列表中定義條目 定義文件中的分割槽或節 定義列表 定義列表中的專案 定義乙個框架集 建立 html 表單 定義最大的標題 定義副標題 定義標題 定義...