<style type="text/css">
A { text-decoration: NONE; color:#51bfe0}
A:hover {font-weight: bold;color:#990099}
<style>
鼠標(biāo)放在鏈接字體上的時(shí)候,鏈接字體變粗,顏色改變,如本博客上的樣子。其中color:#990099表示鏈接字體改變的顏色,可以根據(jù)個(gè)人愛(ài)好修改,其他的不需要改。
<style type="text/css">
a{text-decoration:none; color:#51bfe0}
A:hover{font-size:23; background:#ffd306; color:#990099}
</style>
鼠標(biāo)鼠標(biāo)放在鏈接字體上的時(shí)候,鏈接字體大小改變,顏色改變,有背景顏色。font-size:23表示字體大??;background:#ffd306表示背景顏色color:#990099表示字體顏色,可以根據(jù)個(gè)人愛(ài)好修改,其他的不需要改。
<style type="text/css">
a:link{text-decoration:none}
a:hover{text-decoration:none}
a:visited{text-decoration:none}
</style>
去掉鏈接字體的下劃線。
<STYLE TYPE="text/css">
A { text-decoration: NONE; color: #51bfe0}
A:hover {border-bottom:1px dashed #51bfe0 }
<style type="text/css">
鼠標(biāo)放在鏈接字體上的時(shí)候,鏈接字體加虛線。
<style type="text/css">
A { text-decoration: NONE; color: #51bfe0}
A:hover { position: relative; left:10px; top:10px; }
</STYLE>
鼠標(biāo)放在鏈接字體上的時(shí)候,鏈接字體會(huì)移動(dòng),其left:10px表示字體向上移動(dòng)的距離,top:10px表示字體向上移動(dòng)的距離,可以根據(jù)個(gè)人愛(ài)好修改具體數(shù)值,其他的不需要改。
<style type="text/css">
a { text-decoration: none; padding-bottom: 4px; white-space: nowrap; }
a:hover { background: url(背景圖片地址) repeat-x 100% 100%; }
</style>
鼠標(biāo)放上在鏈接字體上的時(shí)候,鏈接字體出現(xiàn)圖片背景。
<style type="text/css">
a{ text-decoration: none; white-space: nowrap; padding-bottom: 10px; }
a:hover { background: url('http://blog.sina.com.cn/pic/4723cdbf020002nm') repeat-x 100% 100%; }
</style>
鼠標(biāo)放在鏈接字體上的時(shí)候,出現(xiàn)花朵下劃線的效果。
<style type="text/css">
a { text-decoration: none; white-space: nowrap; padding-bottom: 5px; }
a:hover { background: url('http://blog.sina.com.cn/pic/4723cdbf020002nn') repeat-x 100% 100%; }
</style>
鼠標(biāo)放在鏈接字體上的時(shí)候,出現(xiàn)滾動(dòng)箭頭下劃線的效果。
注意:有些代碼應(yīng)該甚用,如果用不好反而會(huì)適得其反,影響頁(yè)面美觀效果!這些代碼用的時(shí)候添加空白面板就行了。還有就是這些都是CSS代碼,不能放在完全沒(méi)有東西的空白面板里,可以把它放到已有內(nèi)容的面板中。