你也許已經意識到，你可以通過指定每一鍵接的不同風格以建立CSS翻滾效果，這些鏈接包括普通的鏈接link (normal), 訪問，翻轉，以及激活。並且，你可能也知道CSS類型的順序可以產生效果上的差別，CSS代碼後順序的風格將會取代針對於相同元素的前順序的風格。建立翻滾效果的類型順序顯得相當重要。
現在讓我們看看如何安排鏈接狀態的類型在不產生沖突的情況下支持正常的翻滾效果，並且如何重新安排這些類型順序以獲得不同的翻滾效果。
鏈接狀態
典型的CSS翻滾效果依賴於超鏈接中四個狀態之一的獨立類型。可以建立附帶CSS預先類的<a>（超鏈接）類型以指定鏈接狀態：
a:link——常規，非訪問超鏈接
a:visited——訪問超鏈接
a:hover——訪問者操作鼠標通過時的鏈接
a:active——點擊鏈接
為了能夠使典型的CSS翻滾效果正常工作，CSS代碼中的CSS類型順序顯得非常重要，無論它是一個外部類型表格或者是嵌入在HIML頁標題欄中的類型規則。
a:link類型出現的時間為最早，因為它可應用於所有的鏈接。a:visited類型排第二，它將取代任何鏈接的a:link格式。(如果a:link類型緊跟著的是a:visited，a:link可能會取代a:visited類型。)其次是a:hover類型，此類型只應用於訪問鼠標下的鏈接。最後是a:active，所以，當鏈接被點擊時，它可以取代所有其它的類型。
1 2 下一頁
在CSS代碼中的類型順序確定了每一種類型如何取代其它的類型，即更多的類型可以應用到特定的元素。正常情況下，a:hover類型處於a:link和a:visited類型之後，所以hover狀態的類型可以應用於常規和訪問的鏈接。但是，它也並非必須遵循這一方式，你可以改變類型順序實現不同的效果。
假設你想在非訪問鏈接中使用翻滾效果，但不想影響到其它訪問鏈接，你或許想到通過代碼來處理這種外形上改變，然而你所要做的是重新組織CSS代碼。
從訪問鏈接中移除翻滾效果，可以通過很簡單地移除a:visited類型。如以下代碼改變CSS代碼中類型順序可以改變訪問鏈接中翻滾效果：
a:link {
color: #0000FF;
text-decoration: underline;
font-weight: normal;
font-style: normal;
}
a:hover {
color: #0000FF;
text-decoration: underline;
background-color: #FFFF00;
font-weight: bold;
font-style: normal;
}
a:visited {
color: #3399FF;
text-decoration: underline;
background-color: #FFFFFF;
font-style: italic;
font-weight: normal;
}
a:active {
color: #FF0000;
text-decoration: none;
background-color: #CCCCCC;
font-weight: bold;
font-style: normal;
}
注意，a:visited類型中包含指定所有與a:hover相同屬性的規則，否則，當訪問者的鼠標通過一個訪問鏈接時，沒有被a:visited類型取代的任何a:hover類型屬性將會繼續再現。
增添其它效果
除非被其它順序的類型取代，以前的類型將會繼續使用相同的元素。所以，仔細選擇鏈接狀態類型的特征和順序可以讓你對非訪問和訪問鏈接建立不同的翻滾效果。
例如，刪除背景顏色：#FFFFFF，以上第二個范例代碼中的a:visited類型規則將允許背景顏色從a:hover類型應用到訪問鏈接。結果為非訪問鏈接的翻轉效果添加了背景顏色和粗體文本。
上一頁 1 2