我的网站位于kenastonchiropractic.com
在 Chrome 中,“主页”链接保持其他链接的颜色,并且在悬停时它们都变为白色。然而,在 Firefox 中,“主页”链接是蓝色的,并且即使在单击后仍保持蓝色(但在悬停时它会变为白色)。IE 的行为似乎是正确的,就像在 Chrome 中一样。
我尝试了很多东西,但没有结果。也许有人可以看到我的错误。
谢谢!
我的网站位于kenastonchiropractic.com
在 Chrome 中,“主页”链接保持其他链接的颜色,并且在悬停时它们都变为白色。然而,在 Firefox 中,“主页”链接是蓝色的,并且即使在单击后仍保持蓝色(但在悬停时它会变为白色)。IE 的行为似乎是正确的,就像在 Chrome 中一样。
我尝试了很多东西,但没有结果。也许有人可以看到我的错误。
谢谢!
为避免此类问题,您最好直接在类似于此的链接上设置颜色:
a{
display:block;
text-decoration:none;
color: #ffffff;
}
而且,您还应该更新您的浏览器版本以防万一。
添加这个:
#nav ul li:hover a {
color: rgb(255, 255, 255);
}
默认浏览器预设覆盖了您的 CSS 规则,因为它更具体。
其他链接不受影响,因为您用 包裹它们<span style="color:#fff">
,这会覆盖它们的默认颜色。
PS:在 Chrome 上,它与所有其他浏览器一样显示为蓝色。
您的“主页”链接是唯一没有被<span style="color:#fff">
.
您需要将padding
加到a tags
not 中li
。
这是一个小提琴。
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">New Patient Process</a></li>
<li><a href="#">Health Products</a></li>
<li><a href="#">About Us</a></li>
</ul>
ul li a {
text-decoration:none;
display:block;
padding: 16px 20px;
color:#583709;
transition:.5s all;
}
ul li a:hover {
color:#fff;
background:#000;
}