hover不起作用的解决办法:1、检查并删除“:hover”前的空格;2、检查并修改正确的类名;3、检查“:hover” 是否 被置于“:link”和“:vis IT ed”之前,修改位置即可。
本教程操作环境:windows7系统、HT ML 5 && CSS3版,DELL G3 电 脑。
css中hover不起作用的 几种 原因 :
1.在设置:hover前加空格:
比如
<style ty PE ="text/css"> .one { m arg in: 0 auto; width: 400px; h ei ght: 300px; background: # ced05d; } .two { mar gin : 0 auto; width: 100px; height: 100px; background: #5a5aea; } .t hr ee { 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不起作用怎么办的详细内容,更多请关注其它相关 文章 !
总结
以上是 为你收集整理的 hover不起作用怎么办 全部内容,希望文章能够帮你解决 hover不起作用怎么办 所遇到的问题。
如果觉得 网站内容还不错, 推荐好友。
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://www.haodehen.cn/did199445