1. 程式人生 > >塊級元素和內聯元素的區別

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

包含塊 div ride 容器 margin set 我們 ram 地址

區別

1.內聯元素允許其他內聯元素與其位於同一行,塊狀元素獨占一行。

2.寬度和高度只對塊狀元素起作用,內聯元素不起作用

3.如果我們把內聯元素轉化成塊狀元素,在相應的內聯元素加上一個屬性display:block就可以了,反之塊級元素轉換為內聯元素在相應的塊級元素上添加 屬性display:inline;就可以啦。

4.text-indent:2em;”屬性,只能加在塊狀元素上面,內聯元素是不起作用的。

5.塊級元素可以包含內聯元素和某些塊級元素,但內聯元素不能包含塊級元素

6.塊級元素不能放在p標簽裏面

7.li 標簽可以包含div

8.塊級元素可以設置margin和padding;行內元素起邊距作用的只有margin-left、margin-right、padding-left、padding-right,其它屬性不會起邊距效果。

塊狀元素:

address - 地址
blockquote - 塊引用
center - 居中對齊
dir - 目錄列表
div - 常用塊級容易,也是CSS layout的主要標簽
dl - 定義列表
fieldset - form控制組
form - 交互表單
h1 - 大標題
h2 - 副標題
h3 - 3級標題
h4 - 4級標題
h5 - 5級標題
h6 - 6級標題
hr - 水平分隔線
isindex - input prompt
menu - 菜單列表
noframes - frames可選內容,(對於不支持frame的瀏覽器顯示此區塊內容
noscript - 可選腳本內容(對於不支持script的瀏覽器顯示此內容)

ol - 有序表單
p - 段落
pre - 格式化文本
table - 表格
ul - 無序列表

內聯元素

a - 錨點

abbr - 縮寫
acronym - 首字
b - 粗體(不推薦)
bdo - bidi override
big - 大字體
br - 換行
cite - 引用
code - 計算機代碼(在引用源碼的時候需要)
dfn - 定義字段
em - 強調
font - 字體設定(不推薦)
i - 斜體
img - 圖片
input - 輸入框
kbd - 定義鍵盤文本
label - 表格標簽
q - 短引用
s - 中劃線(不推薦)
samp - 定義範例計算機代碼

select - 項目選擇
small - 小字體文本
span - 常用內聯容器,定義文本內區塊
strike - 中劃線
strong - 粗體強調
sub - 下標
sup - 上標
textarea - 多行文本輸入框
tt - 電傳文本
u - 下劃線

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