鏈接可以看作是一個文本塞茅，在網(wǎng)頁設(shè)計中嘴办，運營不同的鏈接樣式可以做出更美觀與符合用戶體驗的效果，如果看作一個互動的模塊乾巧，那么在訪客的不同點擊狀態(tài)下也是不同的樣式句喜，下面，小驢中國前端開發(fā)網(wǎng)就跟大家分享一下如何用CSS為鏈接設(shè)置不同樣式沟于。感謝小驢中國官網(wǎng)提供CSS樣式鏈接學(xué)習教程：donkeychina.com
1咳胃、鏈接樣式。
對于鏈接來說旷太，我們可以為這些鏈接設(shè)置不同的樣式展懈。
普通的鏈接樣式：
a:link {color:#FF0000;}
訪問過的鏈接樣式：
a:visited {color:#00FF00;}
2、鏈接樣式互動供璧。
在實際的使用當中存崖，我們可以讓鏈接與鼠標互動起來。
a:hover {color:#FF00FF;}
當鼠標移動到鏈接上面的時候睡毒，這個鏈接樣式就有了改變来惧。
a:active {color:#0000FF;}
這是鏈接被點擊了之后的新樣式。
3演顾、創(chuàng)建復(fù)雜鏈接框供搀。
我們的網(wǎng)頁上的鏈接有時是以一個漂亮 的鏈接框的形式出現(xiàn)。我們可以詳細的定義一下钠至。字體葛虐、形狀、外框棉钧、邊距屿脐、對齊
a:link,a:visited
{
display:block;
font-weight:bold;
font-size:14px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#FFFFFF;
background-color:#98bf21;
width:120px;
text-align:center;
padding:4px;
text-decoration:none;
}
實例代碼：
a:link,a:visited
{
display:block;
font-weight:bold;
font-size:14px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#FFFFFF;
background-color:#98bf21;
width:120px;
text-align:center;
padding:4px;
text-decoration:none;
}
a:hover,a:active
{
background-color:#7A991A;
}
運行效果：
4、其他鏈接樣式。
我們對于鏈接在點擊前后的樣式的改變摄悯，不僅僅局限于顏色，它也可以在文本上作一些變化愧捕，比如下劃線奢驯。CSS鏈接樣式?www.donkeychina.com
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
鏈接在點擊后它的背景色發(fā)生變化。
a:visited {background-color:#FFFF85;}
a:hover {background-color:#FF704D;}
