網頁設定錨點

最後更新：2017-04-18 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

標籤：.com log html_ 有用基本代碼需要 class 網頁

錨連結一般用於本頁面的跳轉,比如頁面太長,到了尾部要瞬間到頂部,就可以用錨連結。

HTML 連結 - name 屬性

name 屬性規定錨（anchor）的名稱。

您可以使用 name 屬性建立 HTML 頁面中的書籤。

書籤不會以任何特殊方式顯示，它對讀者是不可見的。

當使用命名錨（named anchors）時，我們可以建立直接跳至該命名錨（比如頁面中某個小節）的連結，這樣使用者就無需不停地滾動頁面來尋找他們需要的資訊了。

命名錨的文法：

<a name="label">錨（顯示在頁面上的文本）</a>

提示：錨的名稱可以是任何你喜歡的名字。

提示：您可以使用 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 這個命名錨了。

執行個體:

 1 <!DOCTYPE html> 2 <html> 3     <head> 4       <meta charset="utf-8" /> 5       <title> 6        錨點      7      </title>     8     </head> 9     <body>10         <a name="top">11</a>11       <br><br/>     12       <br><br/>     13       <br><br/>     14       <br><br/>     15       <br><br/>    16       <br><br/>     17       <br><br/>     18       <br><br/>     19       <br><br/>     20       <br><br/>    21       <br><br/>     22       <br><br/>     23       <br><br/>     24       <br><br/>     25       <br><br/>    26       <br><br/>     27       <br><br/>     28       <br><br/>     29       <br><br/>     30       <br><br/>    <br><br/>     31       <br><br/>     32       <br><br/>     33       <br><br/>     34       <br><br/>    35       36       <br><br/>     37       <br><br/>     38       <br><br/>     39       <br><br/>     40       <br><br/>    41       <br><br/>     42       <br><br/>     43       <br><br/>     44       <br><br/>     45       <br><br/>    46       <br><br/>     47       <br><br/>     48       <br><br/>     49       <br><br/>     50       <br><br/>    <br><br/>     51       <br><br/>     52       <br><br/>     53       <br><br/>     54       <br><br/>    <br><br/>     55       <br><br/>     56       <br><br/>     57       <br><br/>     58       <br><br/>    59       60       <br><br/>     61       <br><br/>     62       <br><br/>     63       <br><br/>     64       <br><br/>    65       <br><br/>     66       <br><br/>     67       <br><br/>     68       <br><br/>     69       <br><br/>    70       <br><br/>     71       <br><br/>     72       <br><br/>     73       <br><br/>     74       <br><br/>    75       <br><br/>     76       <br><br/>     77       <br><br/>     78       <br><br/>     79       <br><br/>    <br><br/>     80       <br><br/>     81       <br><br/>     82       <br><br/>     83       <br><br/>    84       85       <a href="#top" >頭部</a>86     </body>87 </html>

2.同一頁面跳轉到不同位置

查看 Chapter 4。

Chapter 1