在HTML標(biāo)簽中可以簡單的劃分為兩類元素,一種是 塊級元素 (block)选调,一種是 行內(nèi)元素 (inline)暖释。
塊級元素
<div>
是最常見的HTML標(biāo)簽,它是一個典型的塊級元素褐荷。它的內(nèi)容會獨(dú)立占領(lǐng)至少一行勾效,哪怕內(nèi)部只有一個字符。
在HTML5時代叛甫,為了追求標(biāo)簽語義化层宫,制定了新的類似<div>
的標(biāo)簽,比如 <section>
其监,<nav>
等等萌腿,他們的 display 默認(rèn)屬性都一致。
section,nav,article,header,footer.aside... {
display:block抖苦;
}
//HTML5新增的區(qū)塊元素
在HTML5里毁菱,還有幾種新標(biāo)簽同樣是區(qū)塊元素米死,但是兼容性不好,所以不推薦使用贮庞。
details,dialog,summary {
display:block;
}
//IE和Chrome都不支持,不建議使用
行內(nèi)元素
行內(nèi)元素就更加常見了峦筒,比如<a>
,<img>
,<span>
等等,它們在網(wǎng)頁當(dāng)中不會占領(lǐng)一行窗慎,但是會根據(jù)內(nèi)容來進(jìn)行擴(kuò)張物喷,某些元素可以指定 width 和 height 屬性,設(shè)置元素的寬度和高度遮斥。
我們也可以改變 display 屬性來把使元素能指定大小峦失。
a {
display:inline-block;
width:15px;
height:10px;
}