[英]CSS a:Hover is messing up
I am trying to use separate CSS LINK styles on different classes. 我试图在不同的类上使用单独的CSS LINK样式。 The links are messing up when I "HOVER" on the link.
当我在链接上“悬停”时,链接混乱了。 How can I fix this so there is not a different css style showing when I HOVER OVER the link?
如何解决此问题,以便当我将鼠标悬停在链接上时不会显示不同的CSS样式?
Here is the CSS that is related. 这是相关的CSS。
.menuButton {
display: block;
color: #FFFFFF;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-weight: normal;
text-transform: uppercase;
background-image: url(../images/menuItems/Rosary-Bead-Icon.png);
background-position: left center;
background-repeat: no-repeat;
padding-left: 2.7em;
margin-left: 15px;
float: left;
}
.menuButton a:Link ,a:Visited,a:Active, a:Hover{
display: block;
color: #FFFFFF;
font-size: 1.1em;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-weight: normal;
text-transform: uppercase;
background-position: left center;
background-repeat: no-repeat;
text-decoration: none;
}
.Buttons a:Link ,a:Visited,a:Active,a:Hover{
text-decoration: none;
color: #FFF;
background-image: url(../images/menuItems/buttons/largeBlueUp.png);
height: 57px;
width: 250px;
font-family: Tahoma, Geneva, sans-serif;
font-size: 1.1em;
color: #FFF;
text-decoration: none;
line-height: 55px;
background-repeat: no-repeat;
display: block;
text-align: center;
}
I'm sorry I got distracted by other issues with the page. 抱歉,我对页面的其他问题分心。 The answer is right in the code you shared:
答案恰好在您共享的代码中:
.Buttons a:Link ,a:Visited,a:Active,a:Hover
and 和
.menuButton a:Link ,a:Visited,a:Active, a:Hover{
reads: - .Buttons a:Link - a:Visited - a:Active - a:Hover 读取:-按钮a:Link-a:Visited-a:Active-a:Hover
Change to: 改成:
.Buttons a:Link, .Buttons a:Visited, .Buttons a:Active, .Buttons a:Hover {
and 和
.menuButton a:Link, .menuButton a:Visited, .menuButton a:Active, .menuButton a:Hover {
As what you were doing was applying the style to every a on hover. 正如您正在做的那样,将样式应用于所有悬停状态。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.