我在尝试对妻子的网站进行一些更改时遇到问题。我已经设置了多个类,用于不同的悬停颜色等。例如。 Lft菜单所有海军文字除了下划线和&浅蓝色,悬停在上面,顶部菜单所有白色文字除了下划线和&浅蓝色,悬停在上面。
我尝试了各种各样的事情,却无法让他们一起工作。一个人继续压倒另一个人。任何帮助都会很棒。
该网站已上线。 www.spunkerella.com
这是样式表的代码。
<style type="text/css" >
<!--
* { padding: ; margin: 0; }
body {
font-family: Verdana, Helvetica, sans-serif;
font-size: 13px;
background-color: #17215f;
}
#wrapper {
margin: 30px auto;
width: 900px;
background-color:#ffffff;
border:medium solid #00a9cb;
}
#header {
width: 900px;
float: left;
padding: 0px;
height:250px;
margin: 0px 0px 0px 0px;
background: #ffffff;
}
#leftcolumn {
background: #ffffff;
margin: 0px 0px 0px 0px;
padding: 10px;
width: 180px;
float: left;
}
#rightcolumn {
float: right;
background: #ffffff;
margin: 0px 0px 0px 0px;
padding: 5px;
width: 688px;
display: inline;
}
#footer {
width: 900px;
clear: both;
background: #ffffff;
margin: 0px 0px 0px 0px;
padding: 0px;
}
.style1 {color: #17215f}
.style2 {font-size: xx-small}
a:link {
color: #453223;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #453223;
}
a:hover {
text-decoration: underline;
color: #453223;
}
a:active {
text-decoration: none;
color: #453223;
}
.style3 {color: #453223; font-weight: bold; }
.lgfont {color: #453223;}
.style4
a:link {
color: #ffffff;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #ffffff;
}
a:hover {
text-decoration: underline;
color: #00a9cb;
}
a:active {
text-decoration: none;
color: #ffffff;
}
.style5
a:link {
color: #17215f;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #17215f;
}
a:hover {
text-decoration: underline;
color: #00a9cb;
}
a:active {
text-decoration: none;
color: #17215f;
}
-->
</style>
答案 0 :(得分:0)
当您为CSS中的同一属性指定多个样式时(例如:在悬停时将颜色设置为两个不同的样式),它只能选择其中一个,因此必须覆盖其他样式。这是CSS样式优先级的一个很好的资源:
http://www.w3.org/wiki/CSS/Training/Priority_level_of_selector
希望这有帮助!