我們經(jīng)常在設(shè)計(jì)網(wǎng)站的導(dǎo)航部分的時(shí)候，如果想讓導(dǎo)航超鏈接hover顯示背景，但稍不注意，默認(rèn)的inline會(huì)讓你抓狂，因?yàn)閐isplay:inline會(huì)將超鏈接顯示為內(nèi)聯(lián)元素，即沒有寬和高的作用效果，這里無論你背景怎么設(shè)置，寬高都不會(huì)超出超鏈接的寬高范圍！所以我們可以使用 block 或 inline-block 來解決此問題！

display:block?? 此元素將顯示為塊級(jí)元素，此元素前后會(huì)帶有換行符。
display:inline-block 行內(nèi)塊元素。（CSS2.1 新增的值）

當(dāng)我們?cè)?lt;a>標(biāo)簽里添加 display:block 或 display:inline-block 時(shí)，<a>標(biāo)簽也就有了塊元素的一些特性，此時(shí)我們?cè)O(shè)置<a>標(biāo)簽的寬高才會(huì)起作用，hover背景也才會(huì)有效果，不同的是，display:block 會(huì)讓元素前后帶上換行符，所以如果想讓導(dǎo)航元素在一行內(nèi)顯示，則需要添加float屬性，完整的寫法如下：

<a?href="#"?style="display:?block;?float:left;">block</a>

而display:inline-block 則不需要float屬性，因?yàn)樗谋旧砭褪切袃?nèi)塊元素，寫法如下：

<a?href="#"?style="display:?inline-block;">block</a>