我无法弄清楚为什么.top-nav-section a:link, a:hover, a:active{}会被nav-2-section a:link, a:hover, a:active{}覆盖。即使我设置了全局，nav-2-section仍然会覆盖。这是有问题的HTML / CSS：
body {
font-family: "Gill sans", Arial, sans-serif;
margin: 0;
padding: 0;
}
#logo {
margin: 10px 8px 0 8px;
float: left;
width: 80px;
}
#top-nav {
width: 1000px;
margin: 0 auto;
border: 1px #CCCCCC solid;
}
.top-nav-section {
border-left: 1px #CCCCCC solid;
border-height: 100%;
float: left;
text-decoration: none;
}
.top-nav-section a:link,
a:visited,
a:active {
color: black;
text-decoration: none;
}
.top-nav-menu {
padding: 13px 20px;
}
#search {
background-color: #D3D3D3;
border: none;
font-weight: bold;
height: 25px;
font-size: 14px;
margin: 9px 5px 9px 10px;
float: left;
}
#searchbutton {
height: 25px;
width: 25px;
float: left;
margin: 10px 8px 0 0;
}
#signinpng {
float: right;
height: 18px;
width: 20px;
margin-left: 10px;
}
.clear {
clear: both;
}
#menu-bar-container {
background-color: #BB1919;
width: 100%;
height: 60px;
float: left;
border-top: 1px #CCCCCC solid;
}
#menu-bar {
width: 1000px;
margin: 0 auto;
}
h1 {
padding: 0;
margin: 0;
color: white;
font-size: 44px;
font-weight: normal;
padding-top: 5px;
float: left;
}
#nav-2 {
background-color: #A91717;
width: 100%;
height: 30px;
float: left;
}
#nav-2-container {
background-color: #A91717;
width: 1000px;
height: 30px;
margin: 0 auto;
}
.nav-2-section {
border-left: 1px #CCCCCC solid;
float: left;
}
.nav-2-menu {
text-decoration: none;
color: white;
padding: 1px 10px 1px 10px;
margin: 5px 0 5px 0;
}
.nav-2-section:hover {
border-bottom: 5px white solid;
text-decoration: none;
}
.nav-2-section a:link,
a:visited,
a:active {
color: white;
text-decoration: none;
}<div id="top-nav">
<image id="logo" src="bbc-blocks-dark.png"></image>
<div class="top-nav-section top-nav-menu">Sign In
<input id="signinpng" type="image" src="signin.png"></input>
</div>
<div class="top-nav-section top-nav-menu"><a href="">News</a>
</div>
<div class="top-nav-section top-nav-menu"><a href="">Sport</a>
</div>
<div class="top-nav-section top-nav-menu"><a href="">Earth</a>
</div>
<div class="top-nav-section top-nav-menu"><a href="">Travel</a>
</div>
<div class="top-nav-section top-nav-menu"><a href="">Shop</a>
</div>
<div style="float:right;">
<input id="search" type="text" placeholder="search"></input>
<input type="image" id="searchbutton" src="Search.png"></input>
</div>
<div class="clear"></div>
</div>
<div id="menu-bar-container">
<div id="menu-bar">
<h1>NEWS</h1>
</div>
</div>
<div class="clear"></div>
<div id="nav-2">
<div id="nav-2-container">
<div class="nav-2-section nav-2-menu"><a href="">Home</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">Video</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">World</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">US & Canada</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">UK</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">Business</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">Tech</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">Science</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">Magazine</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">Entertainment & Arts</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">Health</a>
</div>
<div class="nav-2-section nav-2-menu"><a href="">More</a>
</div>
</div>
</div>
答案 0 :(得分：4)
.top-nav-section a:link,
a:visited,
a:active {
color: black;
text-decoration: none;
}
这个很可能不是你想要的。 ,创建了一个全新的选择器，这意味着所有 a:visited和a:active将应用该样式，而不仅仅是{{1}的子元素}}。你想要的是：
.top-nav-section正如您所见，.top-nav-section a:link,
.top-nav-section a:visited,
.top-nav-section a:active {
color: black;
text-decoration: none;
}
需要在此处重复3次。
.top-nav-section需要进行同样的更改。
答案 1 :(得分：0)
CSS代表＆＃34;层叠样式表＆＃34;级联遵循某些牢不可破的规则。 https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started/Cascading_and_inheritance。
在你的情况下
grp x y se conf.low conf.high
0 0 66.27373472086 1.51067072892736 63.3124335788501 69.2350358628699
1 0 74.2148696059611 1.40010518400934 71.4703052207858 76.9594339911364
0 0.67 69.3077020704515 1.31170050247573 66.7364334799 71.8789706610029
1 0.67 76.3216788839049 1.20426555957627 73.9610102692502 78.6823474985597
0 1 70.8020441978622 1.22261128345911 68.4054132705439 73.1986751251804
1 1 77.3593610655788 1.11440617937562 75.1748398271279 79.5438823040297
0 1.33 72.2963863252729 1.1412866614517 70.0591724644355 74.5336001861103
1 1.33 78.3970432472526 1.03045308168746 76.3770915601266 80.4169949343786
0 1.67 73.8360115474536 1.06749385699758 71.7434504636362 75.9285726312711
1 1.67 79.4661703435226 0.951785143725553 77.6004279424212 81.331912744624
0 2 75.3303536748644 1.00766551737773 73.3550714441075 77.3056359056212
1 2 80.5038525251965 0.885018762433004 78.7689893139698 82.2387157364231
0 2.33 76.8246958022751 0.961651291277803 74.9396132276638 78.7097783768863
1 2.33 81.5415347068703 0.830004991659586 79.9145125619316 83.168556851809
0 2.67 78.3643210244558 0.930852945704656 76.5396110870919 80.1890309618197
1 2.67 82.6106618031403 0.788216247319819 81.0655562889848 84.1557673172958
0 3 79.8586631518665 0.918673165304013 78.0578287003509 81.6594976033822
1 3 83.6483439848142 0.764438197615392 82.1498495318225 85.1468384378058
0 3.33 81.3530052792773 0.924646047789058 79.5404624498965 83.165548108658
1 3.33 84.686026166488 0.758771039041166 83.1986407942751 86.1734115387008
0 3.67 82.892630501458 0.949415832811663 81.0315325559489 84.7537284469671
1 3.67 85.755153262758 0.772285708885219 84.2412756798491 87.2690308456669
0 4 84.3869726288687 0.990197010525795 82.445933140954 86.3280121167834
1 4 86.7928354444318 0.803258225588529 85.2182438042978 88.3674270845659
0 4.33 85.8813147562794 1.04552693252472 83.8318144647857 87.9308150477731
1 4.33 87.8305176261057 0.849887736164329 86.1645202148295 89.4965150373818
仅仅因为它的位置（最近的胜利。