XHTML中的超鏈接標簽使用教程
來源:易賢網 閱讀:1195 次 日期:2016-07-04 13:48:12
溫馨提示:易賢網小編為您整理了“XHTML中的超鏈接標簽使用教程”,方便廣大網友查閱!

這篇文章主要介紹了XHTML中的超鏈接標簽使用教程,包括錨鏈接和鏈接相對地址用法的介紹,需要的朋友可以參考下

超鏈接,也叫“鏈接”。超鏈接在我們?yōu)g覽的網頁上可以說是無處不在,我們點擊網頁上某個鏈接地址,即鏈接到另一個網頁,這就是超鏈接在起作用。

使用 <a></a> 標簽來定義超鏈接,語法:

<a href="url">顯示的文字或圖片</a>

例子:

XML/HTML Code

<a >鏈接至百度</a>

瀏覽器顯示效果:

鏈接至百度

當我們點擊上面 “鏈接至百度” 字樣時,瀏覽器便會轉向百度首頁。

超鏈接屬性:

href 鏈接地址??梢允墙^對網頁地址或者相對地址。

target 鏈接目標。取值為 _blank 會在新窗口中打開鏈接地址,缺省則使用當前窗口打開鏈接地址。

name 錨鏈接,這個我們下面會單獨講到。

相對網頁鏈接地址:

XML/HTML Code

<a href="/css" target="_blank">DIV+CSS教程</a>

這個例子使用了相對地址,而在上面鏈接至百度的例子,則使用了絕對地址。

增加了 target 屬性的例子:

XML/HTML Code

<a target="_blank">鏈接至百度</a>

再次點擊該鏈接時,瀏覽器會啟用新頁面打開鏈接地址,而原頁面窗口得以保留。

提示

當一個鏈接地址與當前主題或流程并不十分緊密時,通常會啟用 target="_blank" 屬性,否則盡量不要啟用新窗口,以便給瀏覽者以友好的瀏覽體驗。

如果頁面是由幾個頁面框架幀組成,那么 target 屬性還可以有其他取值

郵件超鏈接

郵件鏈接例子:

XML/HTML Code

<a href="mailto:admin@xyz.com">聯系xyz站的站長</a>

點擊此鏈接,將啟用默認的郵件客戶端撰寫郵件。

錨鏈接

錨鏈接是指頁面內的鏈接,但現在很多人也把文字超鏈接叫做錨鏈接。

我們舉個例子解釋一下錨的作用:

例如我們有一篇文章寫得很好,有很多人都在文章后面作了評論,而發(fā)表評論的窗口一般都在評論結束最底下的位置。網站會在發(fā)表評論的地方設置一個錨鏈接,而在顯示評論的位置設計一個鏈接到錨鏈接,如:“發(fā)表評論”。如果有人不想查看別人留下的評論而想立刻跳轉到評論輸入窗口,那么點擊“發(fā)表評論”即可在本業(yè)內快速跳轉到評論輸入窗口。這種設計無疑提高了瀏覽者的用戶體驗。

使用錨鏈接的例子

創(chuàng)建錨:

XML/HTML Code

<p><a name="comment"></a></p>

創(chuàng)建鏈接至錨的超鏈接地址:

XML/HTML Code

<p><a href="#comment">鏈接至comment錨</a></p>

從例子可以看出,訪問一個錨,就是在鏈接地址后面加上“#”號和錨的名字。上面這個例子由于是鏈接到本頁的錨,因此前面的鏈接地址被忽略(注:實際是相對地址被忽略,在此不做展開討論)。

提示

如果你要實驗這個錨標記的用法,那么注意一點,將鏈接至錨的超鏈接和錨標記之間保持足夠的網頁空間,才能看出效果。可以用我們上面學到的換行標簽來創(chuàng)建足夠多的上下空白空間來進行測試。

你也可以創(chuàng)建一個鏈接至其他頁面的錨標記,例如:

XML/HTML Code

<p><a >鏈接至錨</a></p>

當然需要在 www.abc.com 這個頁面有這個 test 錨標記才行,否則只會鏈接至 www.abc.com 頁面而忽略這個錨標記。

更多信息請查看網頁制作
易賢網手機網站地址:XHTML中的超鏈接標簽使用教程

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯系我們 | 人才招聘 | 網站聲明 | 網站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 加入群交流 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
聯系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:526150442(9:00—18:00)版權所有:易賢網