css標籤顯示模式 塊,行,行內 介紹及轉換

2021-10-11 20:44:37 字數 710 閱讀 6448

常見的塊元素有~、、、 

(1)比較霸道,自己獨佔一行

(2)高度,寬度、外邊距以及內邊距都可以控制。

(3)寬度預設是容器(父級寬度)的100%

(4)是乙個容器及盒子,裡面可以放行內或者塊級元素。

常見的行內元素有、、、、、、、、、等,

其中標籤最典型的行內元素。有的地方也成內聯元素

(1)相鄰行內元素在一行上,一行可以顯示多個。

(2)高、寬直接設定是無效的。

(3)預設寬度就是它本身內容的寬度。

(4)行內元素只能容納文字或則其他行內元素。

注意:

在行內元素中有幾個特殊的標籤——有些資料可能會稱它們為行內塊元素。

元素模式

元素排列

設定樣式

預設寬度

包含塊級元素

一行只能放乙個塊級元素

可以設定寬度高度

容器的100%

容器級可以包含任何標籤

行內元素

一行可以放多個行內元素

不可以直接設定寬度高度

它本身內容的寬度

容納文字或則其他行內元素

行內塊元素

一行放多個行內塊元素

可以設定寬度和高度

它本身內容的寬度

css標籤顯示模式

1.1.1 塊級元素 block level 常見的塊級元素 等,其中標籤是典型的塊元素。塊級元素的特點 1 比較霸道,自己獨佔一行 2 高度,寬度,外邊距和內邊距都可以控制 3 寬度預設是父元素寬度的100 4 是乙個容器及盒子,裡面可以放行內或者塊級元素 1.1.2 行內元素 inline le...

css標籤的顯示模式

塊級元素 block 常見的塊元素,等,最典型的就是div 特點 1 總是從新行開始 2 高度,行高,外邊距以及內邊距都可以控制 3 預設寬度是容器100 行內元素 inline 常見的行內元素,等,最典型的就是特點 1 高度,寬度設定不會顯示效果 2 預設的寬度就是本身內容的寬度 3 和相鄰行內元...

CSS(二)標籤顯示模式

每個塊級元素都會獨自佔一行或者多行,可以對其設定寬度 預設是容器的100 高度及對齊等,可以容納內聯元素或者其他塊元素 p h1不要包裹其他塊級元素 典型的又 div table ul p h1等。內聯元素不占有獨立的區域,僅僅靠自身的字型大小和影象尺寸來支撐結構,一般不可以設定寬度 預設為本身內容...