鏈接大觀（1）

對于鏈接在HTML中的寫法，在這里就不用詳述了，大家可以在許多初級教程中找到這方面的介紹。我們著重介紹以下幾個方面：

　　一、鏈接的種類
　　鏈接有兩種，一種是不同頁面間的鏈接，這種最常見。另外一種則是頁內鏈接，我們一般稱為頁內錨(achor)鏈。
　　頁面之間的鏈接是用URL(United Resource Location:統一資源定位符)來表示，如果是同一個站點之間頁面的鏈接，則可直接根據目錄之間的關系來表達這種鏈接，而不必用“http://...”這樣的形式。如在content目錄下有一個HTML文件的鏈接鏈接到該站點與content目錄同級的目錄chat下的index.htm文件，鏈接則直接表示為:../chat/index.htm。如果你學過DOS命令諸如目錄操作命令的話，相信對這種表示方法不會陌生，只不過是將“\”變為“/”。
　　而對于頁內錨鏈，有些朋友可能會疑惑了，什么叫做頁內錨鏈，有什么用呢？對此，我們以一個很實際的例子來看一看其用處：
　　如果一篇文章很長，并分為幾個部分，文章前面一般都列有該文章的各要點，如果我們因要擇其中一部分閱讀而不停地拉動滾動條是不是費時而費神呢？頁面錨鏈可以讓你很方便地點擊要點鏈接，從而直接閱讀到該部分內容。

　　●定義“錨”
　　要用頁內錨鏈，首先要定義這些所謂的“錨”，即用符號來標識文件中某部分的位置。這要用到HTML標記中一個很常見而又重要的屬性:id(Identification：標識符)。用id可以來指代所屬標記的HTML內容。其定義形式如下：
　　$#@60;Tag id=″...″$#@62;HTML內容$#@60;/Tag$#@62;
　　如 $#@60;p id=″content″$#@62;.........$#@60;/p$#@62;
　　這樣，id content就表示了一個段落。
　　在同一HTML文件中，除了特殊用途外，id最好是唯一的。不然，錨鏈只會連接到第一個id所標識的內容。

　　●加錨鏈
　　定義好“錨”以后，將鏈接指向錨位置的鏈接形式如下:
　　$#@60;a href=″＃id″$#@62;....$#@60;/a$#@62;,即以＃再加上id格式。
　　如:
　　$#@60;a href=″＃chapter1″$#@62;第一章$#@60;/a$#@62;
　　$#@60;a hr ″＃chapter2″$#@62;第二章$#@60;/a$#@62;
　　$#@60;a href=″＃chapter3″$#@62;第三章$#@60;/a$#@62;
　　..............
　　$#@60;P id=″chapter1″$#@62;
　　...第一章內容..
　　$#@60;/P$#@62;
　　$#@60;P id=″chapter2″$#@62;
　　...第二章內容..
　　$#@60;/P$#@62;
　　$#@60;P id=″chapter3″$#@62;
　　...第三章內容..
　　$#@60;/P$#@62;

　　●引用不同頁面內的“錨”
　　可能有些朋友要問，以上加的錨鏈都是在同一個頁面之間的，如果是一個頁面中的錨鏈接到同站點或另一個網站的另一個頁面中的錨怎么辦？很簡單,形式為:
　　$#@60;a href=″URL＃id″$#@62;....$#@60;/a$#@62;
　　如 $#@60;a href=″http://netschool.yesky.com/homepage/index.htm＃block1″$#@62;指向地址：http://netschool.yesky.com/homepage/index.htm文件的第一部分$#@60;/a$#@62;

　　二、鏈接的相關屬性
　　●用CSS樣式類改變鏈接外觀
　　在與網友們交流過程中，他們問到的有關鏈接的問題最多大概集中于：一些網站頁面當鼠標移動時鏈接字會變顏色、字體、出現下劃線等，看起來很精彩，是怎么做的呢？要用到程序嗎？
　　答案：非也，鏈接的CSS可以解你之惑!
　　CSS（層疊樣式單）它主要是用來定義主頁內容相關標記的顯示風格及排列等，可以針對不同的標記定義不同的樣式類，并可以形成樣式表文件供整個網站的主頁文件調用，或者在某個主頁中單獨定義，這樣，可實現在網站風格統一的前提下，而又各有變化，哲學中物質的統一性與多樣性的對立統一之說可謂一語中的。在天極網的網頁陶吧欄目(http://homepage.yesky.com)中有很多關于CSS的講述，這里不再贅述，單講鏈接的幾個重要的CSS屬性:
　　hover:當鼠標懸停在鏈接上方時
　　active:當點擊鏈接時
　　visited：當點擊鏈后
　　這樣就構成點擊鏈接的全過程：移動到鏈接上→點擊→點擊后，我們可以在樣式表中定義三個不同的階段鏈接的外觀，形式如下:
　　$#@60;style$#@62;
　　A{
　　.....
　　}
　　A:hover{
　　.....
　　}
　　A:active{
　　.....
　　}
　　A:visited{
　　.....
　　}
　　$#@60;/style$#@62;
　　上面，其中A{...}的定義表示鏈接在正常狀態下的顯示，這樣，我們就可以用不同的樣式表CSS類型來確定一個站點或特定頁面的鏈接顯示特性。
　　以下是一個例子:
　　A {
　　font－size : 9pt;font－weight : normal;font－style : normal;color: ＃0066CC;text－decoration : none;
　　}
　　A:Hover {
　　font－size : 9pt;
　　font－weight : normal;
　　font－style : normal;
　　color: ＃0066CC;
　　text－decoration : underline;
　　}
　　A:Active　{
　　font－size : 9pt;
　　font－weight : normal;
　　font－style : normal;
　　color:red;
　　text－decoration : none;
　　}
　　A:Visited {
　　font－size : 9pt;
　　font－weight : normal;
　　font－style : normal;
　　color: ＃0066CC;
　　text－decoration : none;
　　}
　　上面的例子中專門對鏈接標記定義了相應的樣式類，并對鏈接的幾種不同狀態對鏈接字的字體、顏色、修飾(如加下劃線)等也作了定義。
(未完待續)