为什么用css中伪类hover实现(鼠标悬停显示文字,鼠标移走文字消失)的效果失败(脚本没有错)?

html-css07

为什么用css中伪类hover实现(鼠标悬停显示文字,鼠标移走文字消失)的效果失败(脚本没有错)?,第1张

根据你的样式来看,你的页面布局是不是这样的<div class="box"><span>购物车</span><div class='detail'>购物相关信息</div></div>,如果是的话,那我觉得你hover用错了。

应该是.box:hover .detail{},也就是说,你写的.box:hover.detail{}hover后面少了一个空格。

找到源码,将链接的鼠标悬浮状态css修改一下,文字隐藏我可以理解成两种情况:

第一种情况,鼠标移上去文字背景都为白色,肉眼看不到,但是鼠标选用某段文字后可见。

这种情况下,将文字颜色color改成黑色black或其他可见的颜色,再添加一个下滑线text-decoration:underline即可

a:hover{text-decoration:underlinecolor:black}

第二种情况:鼠标移上去后,css悬浮状态a:hover加了“display:none”

如果是设置的a:hover{display:none},而非上一种改变文字的情况时。

你只需要将删除display:none删除,或将其修改成display:block即可。