用法:
塊級元素只能用於標籤中
塊級元素與行內元素
塊級元素與行內元素的幾個區別
格式:在預設情況下,塊級元素會從新起一行
內容模型:
塊級元素可以包含其他的塊級元素和行內元素,這種模型會比行內元素有著更加大的結構
塊級元素列表:
1. ---****資訊
2.
---塊引用3. ---定義列表中的條目描述
4. ---文件分割槽
5. ---定義列表
6. ---表單元素分組
7.---form表單
8.
---塊引用9. ---大標題
10.---副標題
11.---定義標題
12. ---定義標題
13. ---定義標題
14. ---最小標題
15. ---水平分割線
16.---不支援指令碼或禁用指令碼
17. ---有序列表
18.
---行
19.
---預格式化文字20. ---**
21. ---表腳注
22. ---無序列表
html5新增
塊級元素:
23. ---文章內容
24. < aside> ---伴隨內容
26. ---繪製圖形
27. ---**資訊組
28. < figcaption> ---**資訊組標題
29. ---區段尾或頁尾
30. ---區段頭或頁頭
31. ---標題組
32. < output> ---表單輸出
33. ---乙個頁面區段
行內元素與塊級元素的區別
內容:
通常情況下,行內元素只能包含資料或其它行內元素
格式:預設情況下,行內元素不會重新起一行,而塊級元素會重新起一行
行內元素列表:
1.--- a標籤元素
2.---表示乙個縮寫形式
3.---定義只取首字母縮寫
4.---字型加粗
5.---可覆蓋的文字方向
6.---大號字型加粗 7.
---換行
8.---引用進行定義
9.---定義計算機**文字
10.---定義乙個定義專案
11.---定義為強調內容
12.---斜體文字效果
13.14.---文字輸入框
15.---定義鍵盤文字
16.---標籤為input 元素定義標註(標記)
17.---定義短的引用
18.---定義樣本文字
19.---下拉列表選單
20.---顯示小號字型效果
31.---組合文字中的行內元素
32.---加粗
33.---定義下標文字
34.---定義上標文字
35.---多行文字輸入控制項
36.---打字機或者等寬的文字效果
37.---定義變數
可變元素
可變元素為根據上下文語境決定該元素是塊級元素或內聯元素
2.button --- 按鈕
3.del --- 刪除文字
4.iframe --- inline frame
5.ins --- 插入文字
6.map --- 區塊
7.object --- object物件
8.script --- 客戶端指令碼
總結:
區別:
1、塊級元素會獨佔一行,其寬度會自動填滿父級元素的寬度
行內元素不會獨佔一行,相鄰間的行內元素會拍到一行內,直到一行的內容排滿才會自動換行,寬度會隨內容的變化而變化
變化:2、塊級元素可以設定width與height;而行內元素設定了width和height會沒有效果
注:塊級元素雖然設定了,但其還會獨佔一行
3、塊級元素可以設定margin與padding,可是行內元素設定了,只有水平方向上有效果、垂直方向上沒有效果
就是說行內元素設定margin-left;margin-right;padding-left;padding-right;有效果;而設定margin-top;margin-bottom;padding-top;padding-bottom;沒有效果
行內元素 塊級元素和行內塊級元素
而標籤的屬性是可以轉換的 display inline 轉換為行內元素 display linline block 轉換為行內塊元素 display block 轉換為塊級元素。行內元素 無法設定寬高 margin和padding上下無效,只有左右有效果 總是和相鄰的行內元素在同一行上,預設排列方式...
行內元素與塊級元素
1.行內元素與塊級元素直觀上的區別 行內元素會在一條直線上排列,都是同一行的,水平方向排列 塊級元素各佔據一行,垂直方向排列。塊級元素從新行開始結束接著乙個斷行。2.塊級元素可以包含行內元素和塊級元素。行內元素不能包含塊級元素。3.行內元素與塊級元素屬性的不同,主要是盒模型屬性上 行內元素設定wid...
塊級元素與行內元素
1 塊級元素與行內元素分別有哪些?塊級元素 div,p,form,ul,li ol,dl,dt,dd,address,fieldset,hr,menu,table等。行內元素 span,strong,em,br,img input,label,select,textarea,i,a等。2 區別 1 ...