当前位置:Gxlcms > css > css伪类中关于visited样式无效的解决方法

css伪类中关于visited样式无效的解决方法

时间:2021-07-01 10:21:17 帮助过:171人阅读

错误写法 将visited写在hover和active之后,例如:

.ui-page-theme-a .digilinx-ui-btn{background:#00a325;border-color:#00891f;color:#FFF;text-shadow: 0 1px 0 #00a325;}
.ui-page-theme-a .digilinx-ui-btn:hover{background:#00891f;border-color:#00721a;color:#FFF;text-shadow: 0 1px 0 #00891f;}
.ui-page-theme-a .digilinx-ui-btn:active{background:#00721a;border-color:#005c15;color:#FFF;text-shadow: 0 1px 0 #00721a;}
.ui-page-theme-a .digilinx-ui-btn:visited{background:#00a325;border-color:#00891f;color:#FFF;text-shadow: 0 1px 0 #00a325;}

造成的结果:点击过的按钮或者链接的样式将会一直固定在visited上,hover和active的样式讲会被覆盖

正确写法 将visited写在前面,如下:

.ui-page-theme-a .digilinx-ui-btn{background:#00a325;border-color:#00891f;color:#FFF;text-shadow: 0 1px 0 #00a325;}
.ui-page-theme-a .digilinx-ui-btn:visited{background:#00a325;border-color:#00891f;color:#FFF;text-shadow: 0 1px 0 #00a325;}
.ui-page-theme-a .digilinx-ui-btn:hover{background:#00891f;border-color:#00721a;color:#FFF;text-shadow: 0 1px 0 #00891f;}
.ui-page-theme-a .digilinx-ui-btn:active{background:#00721a;border-color:#005c15;color:#FFF;text-shadow: 0 1px 0 #00721a;}

以上就是css伪类中关于visited样式无效的解决方法的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行