只要我删除相同css页面上的悬停文本链接,我的图像精灵就能正常工作。图像精灵中的悬停和文本链接样式中的悬停似乎是相互冲突的。如何拿回文本链接样式?我是否使用单独的css作为文本链接,它还会冲突吗?
><div id="page-bg"><img src="x" width="100%" height="100%" /></div>
<div id="container">
<div id="header1">
<ul id="navlist1">
<li id="login"><a href="x"></a></li>
<li id="getmail"><a href="x"></a></li>
<li id="quotebtn"><a href="x"></a></li>
</ul>
</div>
</div> CSS
>body { color:#333; font-size: 9px; }
#page-bg {
position:fixed;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
}
#container {
position: relative;
background: #C35A26;
width: 900px;
font-family: Arial, Helvetica, sans-serif;
margin-top: 25px;
margin-left: auto;
margin-right: auto;
margin-bottom: auto;
}
#header1 {
width: 900px;
height: 232px;
position: relative;
background-image:url(x)
}
#navlist1 {position:relative;}
#navlist1 li{margin:0;padding:0;list-style:none;position:absolute;top:0;}
#navlist1 li, #navlist1 a{height:44px;display:block;}
#login{left:0px;width:94px;}
#login{background:url('x') 0 0;}
#login a:hover{background: url('x') 0 -363px;}
#getmail{left:94px;width:93px;}
#getmail{background:url('x') -94px 0;}
#getmail a:hover{background: url('x') -94px -363px;}
#quotebtn{left:775px;width:125px;}
#quotebtn{background:url('x') -775px 0;}
#quotebtn a:hover{background: url('x') -775px -363px;}
a {
font-family: Arial, Helvetica, sans-serif;
font-size:0.75em;
color: #900;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #900;
}
**a:hover {
text-decoration: underline;
color: #F00;**
}
a:active {
text-decoration: none;
color: #F60; 发布于 2012-08-30 05:37:05
,我现在开始工作了。我所做的就是打开一个空白页,并将css添加到链接和页眉等页面属性中,看看它们是如何布局css的,并重新安排我的css,使我的css像dreamweaver所做的那样,直到标签排列整齐为止。无论如何,它解决了问题。
。
https://stackoverflow.com/questions/5865106
复制相似问题