[已解决]超链接的伪类

910631286 · 发表于 2020-10-12 14:00:49

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

为什么这个伪类在谷歌浏览器中没有效果，在ie和火狐都有这个是为什么？

<!DOCTYPE html>
<html>
        <head>
                <meta charset="utf-8">
                <title></title>
                <style type="text/css">
                        a:hover{
                                
                                color: #ffffff;
                        }
                        a:link{
                                
                                color: #00ff7f;
                        }
                </style>
        </head>
        <body>
                <a href="伪类的练习.html">我是一个a标签</a>
        </body>
</html>

最佳答案

月排行榜 / 总排行榜

Darth_EF

2020-10-16 20:37:03

本帖最后由 Darth_EF 于 2020-10-16 20:39 编辑

因为chrome里:link 和:hover 伪类的优先级是相同的。
你可以看看这个 https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance
如果你想让这段css在chrome 让:hover 伪类生效, 应该把:hover放在:link的后面

<!DOCTYPE html>
<html>
        <head>
                <meta charset="utf-8">
                <title></title>
                <style type="text/css">
                        a:link{
                                
                                color: #00ff7f;
                        }
                        a:hover{
                                
                                color: #ffffff;
                        }
                </style>
        </head>
        <body>
                <a href="伪类的练习.html">我是一个a标签</a>
        </body>
</html>

跳转到最佳答案楼层

星尘鱼 · 发表于 2020-10-16 12:02:37

可能是谷歌浏览器不支持吧

Darth_EF · 发表于 2020-10-16 20:37:03

这个最佳答案由 Darth_EF 给出，感谢 Darth_EF 的回答。

单击隐藏图章

本帖最后由 Darth_EF 于 2020-10-16 20:39 编辑

因为chrome里:link 和:hover 伪类的优先级是相同的。
你可以看看这个 https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance
如果你想让这段css在chrome 让:hover 伪类生效, 应该把:hover放在:link的后面

<!DOCTYPE html>
<html>
        <head>
                <meta charset="utf-8">
                <title></title>
                <style type="text/css">
                        a:link{
                                
                                color: #00ff7f;
                        }
                        a:hover{
                                
                                color: #ffffff;
                        }
                </style>
        </head>
        <body>
                <a href="伪类的练习.html">我是一个a标签</a>
        </body>
</html>

账号		自动登录	找回密码
密码			立即注册