CSS：超連結應用～最入門的語法

本文轉自 06/02/2010 舊Y!Blog　　　　　　　　　　　　

對於想把自己的網誌版面變靚啲初學者來講，看到人家一大堆的CSS語法教學，未了解肯定先暈了半天，倒不如就由最基本的幼稚園初班學起，今次解說最基本超連結的CSS語法。

a{COLOR:#FF0000;}
上句的ａ就是超連結，#FF0000是顏色碼中的紅色。全句就是超連結的字體為呈現紅色。

a:hover {COLOR:#00FF00;}
上句的ａ都是超連結，#00FF00是顏色碼中的綠色，而:hover就是說滑
鼠移過超連結上時展示的效果。全句就是當滑鼠移過超連結時，超連結的字體會為轉變為綠色。

＊顏色代碼可瀏覽：
http://kazuohk.blogspot.hk/2013/02/CSS.word.color.html

而一般時候，當滑鼠移過超連結時，超連結底下都會呈現一條底線，如不喜歡這條底線的話，可以加入下面話法：

text-decoration:none;


合寫成：
a:hover {COLOR:#00FF00;text-decoration:none;}
全句就是當滑鼠移過超連結時，超連結的字體會轉變為綠色及不顯示底線。

另外亦都可以改變超連結的字體大小，例如加入：
font-size:13px;
字體大小就是13px，數值可自行改變

寫成：
１．a{COLOR:#FF0000;font-size:13px;}
全句就是超連結的字體為呈現紅色，字體大小是13px。
２．a:hover {COLOR:#00FF00;text-decoration:none;font-size:15px;}
承接１那句語法，全句就是當滑鼠移過超連結時，超連結的字體由紅色轉變至綠色及不顯示底線，字體大小則由13px變大成15px。

如只在自定ＣＳＳ中加入上面１加２兩句，那麼整個網誌的超連結都會做成一致效果。若果稍後對雅虎的CSS語法認識了更多後，便可以就每一個部份的超連結單獨作出修改，以達至更個人化的效果。