HTML標(biāo)簽一般分為塊標(biāo)簽和行內(nèi)標(biāo)簽兩種類型,,它們也稱塊元素和行內(nèi)元素。具體如下: 塊級元素(block-level)每個塊元素通常都會獨自占據(jù)一整行或多整行,,可以對其設(shè)置寬度、高度,、對齊等屬性,,常用于網(wǎng)頁布局和網(wǎng)頁結(jié)構(gòu)的搭建。 霸道 常見的塊元素有<h1>~<h6>,、<p>,、<div>、<ul>,、<ol>,、<li>等,其中<div>標(biāo)簽是最典型的塊元素,。 塊級元素的特點: (1)總是從新行開始 (2)高度,,行高、外邊距以及內(nèi)邊距都可以控制,。 (3)寬度默認是容器的100% (4)可以容納內(nèi)聯(lián)元素和其他塊元素,。 行內(nèi)元素(inline-level)行內(nèi)元素(內(nèi)聯(lián)元素)不占有獨立的區(qū)域,僅僅靠自身的字體大小和圖像尺寸來支撐結(jié)構(gòu),,一般不可以設(shè)置寬度,、高度,、對齊等屬性,常用于控制頁面中文本的樣式,。 常見的行內(nèi)元素有<a>,、<strong>、<b>,、<em>,、<i>、<del>,、<s>,、<ins>、<u>,、<span>等,,其中<span>標(biāo)簽最典型的行內(nèi)元素。 行內(nèi)元素的特點: (1)和相鄰行內(nèi)元素在一行上,。 (2)高,、寬無效,但水平方向的padding和margin可以設(shè)置,,垂直方向的無效,。 (3)默認寬度就是它本身內(nèi)容的寬度。 (4)行內(nèi)元素只能容納文本或則其他行內(nèi)元素,。(a特殊) 注意:
*塊級元素和行內(nèi)元素區(qū)別 塊級元素的特點: 行內(nèi)元素的特點: 行內(nèi)塊元素(inline-block)在行內(nèi)元素中有幾個特殊的標(biāo)簽——<img />、<input />、<td>,,可以對它們設(shè)置寬高和對齊屬性,,有些資料可能會稱它們?yōu)樾袃?nèi)塊元素。 行內(nèi)塊元素的特點: 標(biāo)簽顯示模式轉(zhuǎn)換 (display)塊轉(zhuǎn)行內(nèi):display:inline; 行內(nèi)轉(zhuǎn)塊:display:block; 塊、行內(nèi)元素轉(zhuǎn)換為行內(nèi)塊: display: inline-block; |
|