在HTML中元素可分為兩大基本類型球凰,塊級
元素(block element)和行內(nèi)
元素(inline element)狮腿。
塊級元素
元素前后帶
有換行符
腿宰,此元素總是單獨占據(jù)一行;寬度缺省是它的容器的100%缘厢;
可以
設(shè)置width吃度,height屬性;(注意:塊級元素即使設(shè)置了寬度,仍然是獨占一行的)贴硫;可以設(shè)置margin和padding椿每;
塊級元素只能出現(xiàn)在
body
元素內(nèi);一般塊級元素可以包含行內(nèi)元素和其他塊級元素英遭。這種結(jié)構(gòu)上的包含繼承區(qū)別可以使塊級元素創(chuàng)建比行內(nèi)元素更”大型“的結(jié)構(gòu)间护。
行內(nèi)元素
元素前后
沒有換行符
,和其他元素都在一行上挖诸;設(shè)置width汁尺,height無效。(可以使用css將元素變?yōu)閴K級元素多律,設(shè)置寬高)痴突;
寬度就是元素內(nèi)文字或圖片的寬度;
行內(nèi)元素的水平方向的padding-left,padding-right,margin-left,margin-right 都產(chǎn)生邊距效果狼荞,但是豎直方向的padding-top,padding-bottom,margin-top,margin-bottom都不會產(chǎn)生邊距效果(水平方向有效辽装,豎直方向無效);
行內(nèi)元素只能包含文本或者其他行內(nèi)元素相味。
可變元素
可變元素是根據(jù)上下文語境決定該元素為塊級元素或者行內(nèi)元素拾积。
空元素
不存在子節(jié)點的元素。
附:
常見的塊級元素
- address - 地址
- article - 文章內(nèi)容 (HTML5)
- aside - 伴隨內(nèi)容(HTML5)
- audio - 音頻播放(HTML5)
- blockquote - 塊引用
- canvas - 繪制圖形
- dd - 定義列表中定義條目描述
- div - 常用塊級容易丰涉,也是css layout的主要標(biāo)簽
- dl - 定義列表
- fieldset - form控制組
- form - 交互表單
- figcaption - 圖文信息組標(biāo)題(HTML5)
- figure - 圖文信息組(HTML5)殷勘,參照 figcaption
- footer - 區(qū)段尾或頁尾(HTML5)
- h1 - 大標(biāo)題
- h2 - 副標(biāo)題
- h3 - 3級標(biāo)題
- h4 - 4級標(biāo)題
- h5 - 5級標(biāo)題
- h6 - 6級標(biāo)題
- header - 區(qū)段頭或頁頭
- hgroup - 標(biāo)題組
- hr - 水平分隔線
- noscript - 可選腳本內(nèi)容(對于不支持script的瀏覽器顯示此內(nèi)容)
- menu - 菜單列表
- noframes - frames可選內(nèi)容,(對于不支持frame的瀏覽器顯示此區(qū)塊內(nèi)容
- ol - 有序列表
- output - 表單輸出(HTML5)
- p - 段落
- pre - 格式化文本
- section - 一個頁面片段
- table - 表格
- tfoot 表腳注
- ul - 非排序列表
- video - 視頻(HTML5)
常見的行內(nèi)元素
- a - 錨點
- abbr - 縮寫
- acronym - 首字 (HTML5 中不支持 <acronym> 標(biāo)簽昔搂。請使用 <abbr> 標(biāo)簽代替。)
- b - 粗體(不推薦)
- br - 換行
- bdo - bidi override
- big - 大字體
- br - 換行
- cite - 引用
- code - 計算機(jī)代碼(在引用源碼的時候需要)
- dfn - 定義字段
- em - 強(qiáng)調(diào)
- font - 字體設(shè)定(不推薦)
- i - 斜體
- img - 圖片
- input - 輸入框
- kbd - 定義鍵盤文本
- label - 表格標(biāo)簽
- q - 短引用
- s - 中劃線(不推薦)
- samp - 定義范例計算機(jī)代碼
- select - 項目選擇
- small - 小字體文本
- span - 常用內(nèi)聯(lián)容器输拇,定義文本內(nèi)區(qū)塊
- strike - 中劃線
- strong - 粗體強(qiáng)調(diào)
- sub - 下標(biāo)
- sup - 上標(biāo)
- textarea - 多行文本輸入框
- tt - 電傳文本
- u - 下劃線
- var - 定義變量
常見的可變元素
- applet - java applet
- button - 按鈕
- del - 刪除文本
- iframe - inline frame
- ins - 插入的文本
- map - 圖片區(qū)塊(map)
- object - object對象
- script - 客戶端腳本
常見的空元素
- area - 在圖片上定義一個熱點區(qū)域
- base - 指定用于一個文檔中包含的所有相對URL的基本URL摘符。一份中只能有一個<base>元素。
- br - 換行
- col - 表格中的列
- colgroup when the span is present // 表格列組
- command - 表示一個用戶可以調(diào)用的命令
- embed - 用于表示一個外部應(yīng)用或交互式內(nèi)容的集合點策吠,換句話說逛裤,就是一個插件。
- hr - 分隔線
- img - 圖片
- input - 文本框等
- keygen - 用于 HTML 表單與其他的所需信息一起構(gòu)造一個證書請求(已廢棄)
- link - 指定了外部資源與當(dāng)前文檔的關(guān)系. 常用語引入css文件
- meta - 表示那些不能由其它HTML元相關(guān)元素表示的任何元數(shù)據(jù)信息.
- param - 定義了 <object>的參數(shù)
- source - 具體說明多媒體資源的類型
- track - 被當(dāng)作媒體元素—<audio> 和 <video>的子元素來使用猴抹。
- wbr - 一個文本中的位置带族,其中瀏覽器可以選擇來換行,雖然它的換行規(guī)則可能不會在這里換行蟀给。
參考資料: