在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 實(shí)現(xiàn)一種效果：鼠標(biāo)滑動(dòng)的時(shí)候，背景色不會(huì)遮住下一行的字體？

實(shí)現(xiàn)一種效果：鼠標(biāo)滑動(dòng)的時(shí)候，背景色不會(huì)遮住下一行的字體？

clipboard.png
如圖 知乎的背景色已經(jīng)遮蓋住了博客和微信，但是把LI元素浮動(dòng)后，就能達(dá)到這種效果，只不過水平排列了？請問為什么會(huì)出現(xiàn)這種情況？
http://js.jirengu.com/dipas/1...

回答
編輯回答
短嘆

原因：

  1. li的高度為21px
    clipboard.png
  2. a的高度為35px
    clipboard.png

結(jié)論：不設(shè)置浮動(dòng)時(shí)，li標(biāo)簽的高度比a標(biāo)簽的高度小。所以a的背景會(huì)超出li所在行，溢出到相鄰的上下行中。
解決：設(shè)置li的高度超過a的高度即可。

li{
  list-style: none;
  height：40px;
  /* float: left; */
}

clipboard.png

2017年1月14日 01:15
編輯回答
不將就

li>a設(shè)置display:inline-block;
或者把padding去掉

2018年8月7日 08:48
編輯回答
避風(fēng)港

padding的問題，把padding去了
水平居中text-align:center;
垂直居中用line-height:40px;
垂直居中像素高度自己定

2018年3月25日 15:33
編輯回答
怪痞

設(shè)置一下z-index應(yīng)該能夠?qū)崿F(xiàn)吧

2018年4月27日 16:40