解决鼠标无法划到hover触发后的显示区域的问题

现象如下:

解决鼠标无法划到hover触发后的显示区域的问题_第1张图片

 当鼠标划入上方链接通过hover触发的显示区域时,该区域就会消失。也就是鼠标无法进入该区域。

造成这个问题的根本原因是:hover效果的交互区域太小,导致鼠标很容易就脱离了hover的触发边界

解决办法: 通过设置line-height撑开被hover元素的容器高度,扩大hover的交互区域

解决鼠标无法划到hover触发后的显示区域的问题_第2张图片

你可能感兴趣的:(html,css,css3)