超連接的問題

Question

我在CSS裡寫的代碼：
a{
    display: block;float: left; width: 120px;text-decoration:none;color: #000000;
    background: url(images/a.gif) no-repeat;  
}
a:hover {
text-decoration: none; color: #E58C24;
}
a:active{
    color: #E58C24;background: url(images/b.gif) no-repeat;
}
ul {
    text-align: center;
margin: 0;
list-style: none;
}
然後我在下面這樣用：<div>
<ul>
<li> <a href="aat.aspx" Target="main">1 </a></li>
<li> <a href="ggt.aspx" target ="main">2 </a></li>
</ul>
</div>
我點1時。。他會改變背影圖片b，2的背影圖片為a.我點2時他會改變背影圖片b,1背影變為a.可是我鼠標點別的地方,所有的背影為什麼都會變成a呢?如果我想我點別的地方那一個背影圖片不變。這要怎麼改呢？
我是新手希望各位多多指點。

Answer 1

用js吧<style>
.a{ 
    display: block;float: left; width: 120px;text-decoration:none;color: #000000; 
    background: url(images/1.jpg) no-repeat;   
} 
a:hover { 
text-decoration: none; color: #E58C24; 
} 
.b{ 
    color: #E58C24;background: url(images/2.jpg) no-repeat; width: 120px;
} 
ul { 
    text-align: center; 
margin: 0; 
list-style: none; 
} 
</style>
然後我在下面這樣用： <div> 
<ul> 
<li>   <a href="aat.aspx" Target="main" class='a' onclick="javascript:this.className='b';"> 1  </a> </li> 
<li>   <a href="ggt.aspx" target ="main" class='a' onclick="javascript:this.className='b';"> 2  </a> </li> 
</ul> 
</div> 

Answer 2

用我的
/*超链接常用样式*/
.mylink {
font-family: "宋体";
font-size: 12px;
color: white;
TEXT-DECORATION: none;
cursor:hand;
}.mylink A:link {
font-family: "宋体";
font-size: 12px;
color: white;
text-decoration: none;
}.mylink A:visited {
font-family: "宋体";
font-size: 12px;
color: white;
text-decoration: none;
}.mylink A:hover {
font-family: "宋体";
font-size: 14px;
color: white;
text-decoration: none;
}.mylink A:active {
font-family: "宋体";
font-size: 12px;
color: white;
text-decoration: none;
}

Answer 3

我試過啦。不過沒有實現我想要的那一種功能，我點別的地方是那一個連接是沒有改變背影，不過我點1時。。他會改變背影圖片b，2的背影圖片為a.我點2時他會改變背影圖片b,1背影變為a這種功能就沒有啦。