前端 塊元素 行內元素

2021-07-11 20:44:06 字數 1806 閱讀 3894



內嵌元素(html中規範定義):

也叫內聯元素、內嵌元素、行內元素、直進式元素.

與行內元素對應的就是塊元素,都是html中規範的概念...

行內元素:乙個挨著乙個,都在同一行從左到右順序顯示,不單獨佔一行...

塊元素:一般都從新行開始,相鄰的塊級元素將會在不同行顯示...

當加入了css之後,塊元素和行內元素的差異就不算是差異了

行內元素+display:block=塊元素

塊元素+display:inline=行內元素

常見的行內元素: 1 

a – 錨點

2 abbr – 縮寫

3 acronym – 首字

4  b – 粗體(不推薦)

5 bdo – bidi override

6  big – 大字型 7 

br – 換行

8 cite – 引用

9 code – 計算機**(在引用原始碼的時候需要)

10 dfn – 定義字段

11  em – 強調

12 font – 字型設定(不推薦)

13 i– 斜體

14 img –

15 input – 輸入框

16 kbd – 定義鍵盤文字

17  label – **標籤

18 q – 短引用

19 s – 中劃線(不推薦)

20 samp – 定義範例計算機**

21  select – 專案選擇

22 small – 小字型文字

23 span – 常用內聯容器,定義文字內區塊

24 strike – 中劃線

25  strong – 粗體強調

26 sub – 下標

27 sup – 上標

28  textarea– 多行文字輸入框

29 tt – 電傳文字

30 u – 下劃線

31  var – 定義變數

常見的塊元素:

◎ 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 - 非排序列表(無序列表)

可變元素(根據上下文的語境判斷):

◎ button - 按鈕 ◎

del - 刪除文字

◎iframe - inline frame

◎ins - 插入的文字

◎map - 區塊(map)

◎object - object物件

◎ script - 客戶端指令碼

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

塊級元素 一行只能放乙個,可以設定寬度高度,預設為容器的100 可以包含任何標籤 常用元素 div hr p h1 h6 ul ol dl form table 行內元素 一行可以放多個行內元素,不可以直接設定寬度高度,預設為本身內容的寬度,容納文字或其他行內元素 常用元素 span a i em ...

塊元素,行元素,行內塊元素

1.內容獨佔一行 2.塊元素可以設定寬高 3.如果不設定寬高,寬度就等於父元素的寬度,高度就等於內容的高度 4.塊元素可以設定內外邊距 5.多個塊元素之間上下排列 常見的塊元素 div,section,p,h1 h6,hr,ul,li等 塊元素可以通過margin 0 auto 實現定寬居中的效果 ...

塊級元素,行內元素,行內塊元素

內聯元素 行內元素 內聯元素 inline element 行內塊元素 a 錨點 abbr 縮寫 acronym 首字 b 粗體 不推薦 bdo bidi override big 大字型 br 換行 cite 引用 code 計算機 在引用原始碼的時候需要 dfn 定義字段 em 強調 font ...