(1)塊級元素(block)
常見得塊級元素有
:~、、、1. 自己獨佔一行
2. 可以設定寬度和高度,外邊距以及內邊距都可以控制
3. 寬度預設是容器(父級寬度)得100%
(2)行內元素(inline)
常見的行內元素有
:、、、、、、、、、
等
1.一行可以顯示多個行內元素
2.高度和寬度直接設定是無效得
3.預設寬度就是他本身內容得寬度
(3)行內塊元素(inline-block)
在行內元素中有幾個特殊的標籤——
1.和相鄰行內元素(行內塊)顯示在一行上,但是中間會有空白縫隙,一行可以顯示多個。
2.可以直接設定高度,預設寬度就是他本身內容得寬度。
3.高度,行高、外邊距以及內邊距都可以控制。
三種模式總結區別元素模式
元素排列
設定樣式
預設寬度
包含塊級元素
一行只能存放乙個塊級元素
可以設定寬度和高度
容器(父級元素)100%
容易可以包含任何標籤
行內元素
一行可以存放多個行內元素
不能直接設定寬度和高度
它本身內容得寬度
容納文字或其他行內元素
行內塊元素
一行可以存放多個行內塊元素
可以設定寬度和高度
它本身內容得寬度
標籤顯示(display)模式相互轉換
標籤顯示模式(display)
html標籤一般分為塊標籤和行內標籤兩種型別,它們也稱塊元素和行內元素。具體如下 每個塊元素通常都會獨自佔據一整行或多整行,可以對其設定寬度 高度 對齊等屬性,常用於網頁布局和網頁結構的搭建。常見的塊元素有 等,其中標籤是最典型的塊元素。塊級元素的特點 1 總是從新行開始 2 高度,行高 外邊距以及...
display可以控制標籤的顯示模式
display none inline block inline block 繼承性 無 display值的解釋 none 此元素不被顯示,此文件中被移除。與visibility屬性的hidden值不同,其不為被隱藏的物件保留其物理空間 block 此元素按塊級元素顯示 前後換行符,自己佔一行。內聯...
CSS系列 02 標籤顯示模式 display
常見的塊元素有常見的行內元素有 等,其中標籤最典型的行內元素。行內元素的特點 1 和相鄰行內元素在一行上,但是之間會有空白縫隙 2 高 寬無效,僅外邊距 水平方向 以及內邊距 水平方向 可以正常控制 3 寬度預設就是它本身內容的寬度 注意 如果元素為行內元素,其垂直方向的內邊距也會生效,只是該元素會...