塊狀元素與內聯(行內)元素的巢狀規則

2022-08-03 19:00:24 字數 762 閱讀 2888

如果不按照html規則書寫**時,瀏覽器就不會正確解析,會將不符合巢狀規則的節點放到目標節點的下面,或者變成純文字。html存在許多種型別的標籤,有的標籤下面只允許特定的標籤存在,這就是html巢狀規則。 

塊狀元素:一般是其他元素的容器,可容納內聯元素和其他塊狀元素,塊狀元素排斥其他元素與其位於同一行,寬度(width)高度(height)起作用。 

內聯元素(行內元素):內聯元素只能容納文字或者其他內聯元素,它允許其他內聯元素與其位於同一行,但寬度(width)高度(height)不起作用。 

塊狀元素與內聯(行內)元素的巢狀規則

1、塊狀元素可包含內聯元素或某些塊元素,但內聯元素不可包含塊元素,只能包含內聯元素。 

正確 正確 

錯誤 2、塊級元素不能放在裡面

錯誤 錯誤 

3、有幾個特殊塊級元素只能包含內聯元素,不能包含塊級元素。這幾個特殊標籤是 h1~h6、p、dt

4、li 內可包含 div 標籤

5、塊級元素與塊級元素並列、內聯元素與內聯元素並列

正確 正確 

錯誤 參考自:

行內元素 塊狀元素 內聯塊狀元素

行內元素 div,h1 h6,p,pre,ul,ol,li,form,table等 常見的行內元素 無法自動換行,無法設定寬高 有 a,img,span,i 斜體 em 強調 sub 下標 sup 上標 label等。常見的內聯塊狀元素 擁有內在尺寸,可設定高寬,不會自動換行 有 button,in...

內聯元素(行內元素),塊狀元素,行內塊狀元素的區別

html 元素指的是從開始標籤到結束標籤的所有 元素的分類方式分為行內元素 塊狀元素和行內塊狀元素三種,這三者可以通過設定display屬性值實現相互轉化。1 display inline 轉換為行內元素 2 display block 轉換為塊狀元素 3 display inline block ...

行內元素 塊狀元素 行內塊狀元素

頁面元素主要分為三類 塊元素 行內元素,行內塊元素。三者可以通過display進行相互轉換 display block 塊元素 display inline 行內元素 display inline block 行內塊元素 1 塊元素 塊狀元素代表性的就是div,其他如p h1 h6 ul ol dl...