hover不起作用怎么办
导读:收集整理的这篇文章主要介绍了hover不起作用怎么办,觉得挺不错的,现在分享给大家,也给大家做个参考。hover不起作用的解决办法:1、检查并删除“:hover”前的空格;2、检查并修改正确的类名;3、检查“:hover”是否被置于“:li...
收集整理的这篇文章主要介绍了hover不起作用怎么办,觉得挺不错的,现在分享给大家,也给大家做个参考。hover不起作用的解决办法:1、检查并删除“:hover”前的空格;2、检查并修改正确的类名;3、检查“:hover”是否被置于“:link”和“:visITed”之前,修改位置即可。
@H_126_6@
本教程操作环境:windows7系统、HTML5& & CSS3版,DELL G3电脑。
css中hover不起作用的几种原因:
1.在设置:hover前加空格:
比如
style tyPE="text/css"> .one { margin: 0 auto; width: 400px; height: 300px; background: #ced05d; } .two { margin: 0 auto; width: 100px; height: 100px; background: #5a5aea; } .three { margin: 0 auto; width: 200px; height: 100px; background: #4b9c49; } .four { margin: 0 auto; width: 300px; height: 100px; background: #7b4141; } .one :hover { background: #da56d0; } /style> body> h1> 测试/h1> div class="one"> div class="two"> /div> div class="three"> /div> div class="four"> /div> /div> /body>
你发现鼠标经过class为one的时候背景不变,而经过one里面的其他div背景颜色发生变化,
说明:hover前加空格,本身不会有:hover的效果,而后代元素会有:hover的效果。
【推荐学习:css视频教程】
2.当鼠标经过时,让其他元素改变样式:
这时候你会发现,只有后代元素和兄弟元素(紧接在元素后的兄弟元素)才有效果,其他的:hover会失效
3.类名写错了;
4.:hover 被置于 :link 和 :visited 之前了;
在 CSS 定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的。
在 CSS 定义中,a:active 必须被置于 a:hover 之后,才是有效的。
以上就是hover不起作用怎么办的详细内容,更多请关注其它相关文章!
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: hover不起作用怎么办
本文地址: https://pptw.com/jishu/588699.html