17 - 05 - 15 HTML（錨鏈接）
2/10/2017來源：心得技巧人氣：20531
——————————————————————————整理自w3school，www.w3school.com /百度知道
# HTML 鏈接 - name 屬性 ( 難點 )
name 屬性規定錨（anchor）的名稱。
您可以使用name屬性創建HTML頁面中的書簽。
書簽不會以任何特殊方式顯示，它對讀者是不可見的。
當使用命名錨（named anchors）時，我們可以創建直接跳至該命名錨（比如頁面中某個小節）的鏈接，
這樣使用者就無需不停地滾動頁面來尋找他們需要的信息了。
（百度百科經常使用，在本頁面內 上下跳轉，快速定位）錨點鏈接的意思說就是：
“abc”就是一個鏈接，我點擊“abc”之后，就會跳轉到"123"的位置上。最常用的方式，
在一個網頁的開頭，做一個目錄，每一個目錄都是一個錨點鏈接，然后鏈接到本頁面相關的位置。
命名錨的語法：
<a name="label">錨（顯示在頁面上的文本）</a>
Tips：可以使用 id 屬性來替代 name 屬性，命名錨同樣有效。
比如：首先，我們在 HTML 文檔中對錨進行命名（創建一個書簽）：
<a name="tips">基本的注意事項 - 有用的提示</a>
然后，我們在同一個文檔中創建指向該錨的鏈接：
<a href="#tips">有用的提示</a>
您也可以在其他頁面中創建指向該錨的鏈接：
<a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>
在上面代碼中，我們將 # 符號和錨名稱添加到 URL 的末端，就可以直接鏈接到 tips 這個命名錨了。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/CSS"> .d1{ border:1px solid red; <!--網頁邊框是red color--> width:400px; height:2000px; } .d2{ border:1px solid blue; <!--點我跳轉mao1是藍色的字體--> width:400px; height:400px; margin-top:1000px; } </style> <title>錨鏈接的使用</title> </head> <div class="d1"> <a href="#mao1">點我跳轉mao1</a> <div class="d2"> <a name="mao1">我是mao1</a> </div> </div> <body> </body> </html>講解：d1，d2 是自己創建的類的名稱。
-
-
再來一個最簡單的例子：
<a href="#C4">查看 Chapter 4。</a>
</p>
<h2><a name="C4">Chapter 4</a></h2>
點擊查看Chapter 4之后，就可以跳轉到Chapter 4標題這里。
最新文章推薦