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

html-css03

为什么用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即可。