2009-05-26 78 views
2

我在我的網站的超鏈接,我想爲a:linka:visited是部分#A0A0A0和部分#880000,我希望它改變部分#FFFFFF和部分#AA0000a:hovera:active。但我希望它成爲一個鏈接。到目前爲止我已經嘗試了兩種解決方案,但都沒有按照我想要的方式實現。如何在一個超鏈接中獲取兩種顏色?

第一個是:

a.menu:link { color: #a0a0a0; text-decoration: none; } 

a.menu:visited { color: #a0a0a0; text-decoration: none; } 

a.menu:hover { color: #ffffff; text-decoration: none; } 

a.menu:active { color: #ffffff; text-decoration: none; } 

<a class="menu" href="/about.html">Dubious 
    <span style="color: #880000;">Array</span> 
.net</a> 

在這種解決方案中,中間部分(「陣列」)的顏色保持原樣#880000整個時間並且不改變到#AA0000:hover:active

第二種解決方案是創建一個<a> </a>爲所述串的每一部分(因此一個關於「可疑」,一個用於「陣列」和一個關於「.NET」),並且具有用於中間<a> </a>的CSS是

a.redMenu:link { color: #880000; text-decoration: none; } 

a.redMenu:visited { color: #880000; text-decoration: none; } 

a.redMenu:hover { color: #AA0000; text-decoration: none; } 

a.redMenu:active { color: #AA0000; text-decoration: none; } 

顏色以這種方式正常工作;但字符串是三個單獨的鏈接,因此通過一個鏈接進行移動不會改變其他鏈接的顏色。

所以我想要做的就是將超鏈接中的css從a.menu更改爲a.redMenu然後再返回a.menu,但我無法解決問題。任何人都可以解決我的問題嗎?

謝謝,雅各布

回答

4

您可以使用原有的HTML,只是刪除內嵌樣式:

​​3210

然後,只需添加這些CSS聲明跨度:

a.menu:link span, a.menu:visited span{color: #880000;} 
a.menu:hover span, a.menu:active span {color: #aa0000;} 
1
a.redMenu:hover span { color: #AA0000; text-decoration: none; } 

這告訴跨度什麼顏色是當它的父鏈接懸停。

1
<html> 
<head> 

<style type="text/css"> 

p { background: #00c } 
a.menu:link { color: #a0a0a0; text-decoration: none; } 
a.menu:visited { color: #a0a0a0; text-decoration: none; } 
a.menu:active { color: #ffffff; text-decoration: none; } 
a.menu:hover span.normal { color: #800 } 
a.menu:hover span.hilite { color: #880 } 

</style> 

</head> 

<body> 

    <p><a class="menu" href="/about.html"><span class="normal">Dubious 
     <span class="hilite">Array</span> .net</span></a> 
    </p> 

</body> 
</html> 
相關問題