我們?cè)趯?xiě)導(dǎo)航或者頁(yè)面有超鏈接的地方，有一些是需要超鏈接的背景和Li的寬度一樣的。但是，卻沒(méi)有達(dá)到這種效果？為什么？ 我們做的效果圖：如下

期望的效果：如下

出現(xiàn)這樣的原因：由于a是個(gè)行內(nèi)元素，它沒(méi)有寬高這種概念，a的大小全憑內(nèi)容撐，所以，為了解決這個(gè)問(wèn)題我們給a這標(biāo)簽加一個(gè)display:block;樣式，這樣就可以達(dá)到目的。

樣式表

還有一個(gè)小技巧，我們?cè)诮oli前面自定義小圖標(biāo)時(shí)候，發(fā)現(xiàn)圖標(biāo)離文字特別近，有重合的現(xiàn)象，我們這時(shí)候，就可以給li加一個(gè)內(nèi)填充，padding-left：20px； 這樣就可以讓圖標(biāo)和內(nèi)容有一定的距離。或者給li的下級(jí)標(biāo)簽設(shè)置一個(gè)margin-left:25px；也是一樣的效果。 還有:如果小圖標(biāo)不居中，或者在鼠標(biāo)hover的時(shí)候，位置發(fā)生了移動(dòng)，都可以在background后面添加left center。

?

另外制作導(dǎo)航欄的技巧

?

轉(zhuǎn)載于:https://www.cnblogs.com/xiaqilin/p/6880191.html

總結(jié)

以上是生活随笔為你收集整理的鼠标滑过，解决ul下 li下a的背景与父级Li不同宽的问题的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。