錨點 跳轉

端端的土化程式碼發表於2019-03-06

html錨點(mao dian)--特殊的超連結 錨點(anchor):其實就是超連結的一種,一種特殊的超連結

 普通的超連結,<a href="路徑"></a> 是跳轉到不同的頁面

 而錨點,<a href="路徑"></a> 可以在同一個頁面中不同的位置間跳轉

 可以看到,跳轉到錨點的超連結跟普通的超連結格式是一樣的,
複製程式碼

1.使用錨點的步驟: 1.1.先建立錨點目標, 如上所述,錨點可以在同一頁面的不同位置間跳轉,其實就是在元素間跳轉,

    常用的場景就是,頁面很長,讓使用者方便在頁面不同部分間跳轉

    建立錨點目標,只需要給目標元素增加id或者name即可,推薦id:

    <div id="test" name="test"></div>
複製程式碼

1.2.要建立跳轉到id="test"的div的錨點,

注意:1.錨點的超連結路徑一定包含"#",而後面緊跟元素的id或者name

          (所以id和name必須一樣,其實我試了有時name是不生效的)
複製程式碼

2.錨點使用總結: 2.1. 建立錨點的元素必須要有id或name屬性,最好兩個都有 2.2. 錨點超連結一定包含井號"#",錨點超連結都在連結的最末端,具體看後面例子 2.3. 同一個頁面不同部分的跳轉,錨點的寫法 目標元素:

錨點超連結:

2.4. 不同頁面跳轉,同時存在錨點 目標元素:a.html頁面的

錨點超連結:

       (先跳到a.html頁面,然後再尋找id=test的元素)
複製程式碼

2.5. 不同頁面帶引數跳轉,同時存在錨點 目標元素:a.php?p=abc頁面的

錨點超連結:

相關文章