用于链接的文本保持相同的颜色(紫色),即使我从未将其设置为该颜色并希望它是白色。
我尝试添加nav:link,nav:active等,但是它只是更改回默认值而没有CSS
nav{
font-family: sans-serif;
font-weight: bold;
font-size: 30px;
text-align: center;
word-spacing: 300px;
color: #edf5e1;
background-color: #05386b;
text-decoration: none;
}
<nav>
<a href="">Home</a>
<a href="">Projects</a>
<a href="">About</a>
<a href="">Contact</a>
</nav>
文字要全白,没有下划线
答案 0 :(得分:2)
a标签具有其自己的显式样式,因此您需要直接覆盖它们。只需在父nav标签上设置颜色就不会更改它们,您需要自行设置a标签的样式。
nav a{
font-family: sans-serif;
font-weight: bold;
font-size: 30px;
text-align: center;
word-spacing: 300px;
color: #edf5e1;
background-color: #05386b;
text-decoration: none;
}
<nav>
<a href="">Home</a>
<a href="">Projects</a>
<a href="">About</a>
<a href="">Contact</a>
</nav>
答案 1 :(得分:1)
您需要为nav a
而不是nav
应用样式。 a
默认具有浏览器使用的某些样式。
nav {
font-family: sans-serif;
font-weight: bold;
font-size: 30px;
text-align: center;
word-spacing: 300px;
color: yellow;
background-color: #05386b;
}
nav a {
color: #fff;
text-decoration: none;
}
<nav>
<a href="">Home</a>
<a href="">Projects</a>
<a href="">About</a>
<a href="">Contact</a>
</nav>
答案 2 :(得分:1)
是的,您需要直接定位链接,如下所示:
nav a,
nav a:link,
nav a:visited,
nav a:hover,
nav a:active {
color: #FFFFFF;
text-decoration: none;
}
您可能不需要此处显示的所有状态,但这会使链接始终显示为白色,没有下划线。
答案 3 :(得分:0)
实际的浏览器默认链接颜色为蓝色。
要使其出现,只需将CSS选择器nav
替换为nav a
,以设置锚标记(而不是nav
元素)上的所有属性。
nav a {
font-family: sans-serif;
font-weight: bold;
font-size: 30px;
text-align: center;
word-spacing: 300px;
color: #edf5e1;
background-color: #05386b;
text-decoration: none;
}