html 網(wǎng)頁中的錨點(diǎn)(命名錨記)的使用介紹
發(fā)布時(shí)間:2013-11-21 16:10:30 作者:佚名
我要評(píng)論

html中的錨點(diǎn)想必大家并不陌生吧,錨點(diǎn)是網(wǎng)頁制作中超級(jí)鏈接的一種,又叫命名錨記,下面以實(shí)例的方式為大家介紹下錨點(diǎn)的使用,不了解的朋友可不要錯(cuò)過哦
以下資料整理自網(wǎng)路
1.錨點(diǎn)是網(wǎng)頁制作中超級(jí)鏈接的一種,又叫命名錨記。命名錨記像一個(gè)迅速定位器一樣是一種頁面內(nèi)的超級(jí)鏈接,運(yùn)用相當(dāng)普遍。
英文名:anchor
使用命名錨記可以在文檔中設(shè)置標(biāo)記,這些標(biāo)記通常放在文檔的特定主題處或頂部。然后可以創(chuàng)建到這些命名錨記的鏈接,這些鏈接可快速將訪問者帶到指定位置。
創(chuàng)建到命名錨記的鏈接的過程分為兩步。首先,創(chuàng)建命名錨記,然后創(chuàng)建到該命名錨記的鏈接。
示例代碼
在HTML頁面中適當(dāng)位置定義如下的錨點(diǎn):
<a name="top">這里是TOP部分</a>
<a name="content">這里是CONTENT部分</a>
<a name="foot">這里是FOOT部分</a>
(您可以使用 id 屬性來替代 name 屬性,命名錨同樣有效。[1])
對(duì)于如上錨點(diǎn)的訪問有兩種方法
一種是利用超鏈接標(biāo)簽<a></a>制作錨點(diǎn)鏈接,主要用于頁面內(nèi)的錨點(diǎn)訪問
<a href="#top">點(diǎn)擊我鏈接到TOP</a>
<a href="#content">點(diǎn)擊我鏈接到CONTENT</a>
<a href="#foot">點(diǎn)擊我鏈接到FOOT</a>
另一種方式是直接在頁面地址后面加錨點(diǎn)標(biāo)記,主要用于不同頁面之間的錨點(diǎn)訪問
假如本頁面的地址是http://文件路徑/index.html,要訪問foot錨點(diǎn)只要訪問如下鏈接即可
http://文件路徑/index.html#foot
2.html 錨點(diǎn) 到底是干嗎的?
通俗簡(jiǎn)單地說,比如一篇很長(zhǎng)的文章,你想按分段精確來看,那就可以用到錨點(diǎn)了。
代碼:
<a href="#001">跳到001</a>
...文字省略
<a name="001" id="001" ></a>
...文字省略
其實(shí)錨點(diǎn)只需name就可以可,加id是為了讓它兼容性更好.
href的值要跟name \ i d 一致,前面必須加"#",以上代碼在ie6/7,ff中都可以兼容,但在ie8中就不行。
因?yàn)槲覀冨^點(diǎn)的<a></a>值為空,為不影響美觀我們加個(gè)空格就行了,
如以下代碼,就可以兼容ie8
<a href="#001">跳到001</a>
...文字省略
<a name="001" id="001" > & n b s p </a>
...文字省略
另一問題,想顯示某頁面(如:123.html)的某錨點(diǎn)內(nèi)容呢?
代碼如下
<a href="123.html#001">跳到001</a>
...文字省略
<a name="001" id="001" > & n b s p </a>
...文字省略
這是昨天在做后臺(tái)時(shí)候,想實(shí)現(xiàn)“修改定位”,就把錨點(diǎn)標(biāo)記搬了出來(平常它都被我遺忘)。
但是程序那邊說他們要取值,連接中必須要有“?”或“&”,那這樣我的錨點(diǎn)就不兼容了...
呵呵!以后會(huì)有解決方法的!
雖然在jsp頁面中錨點(diǎn)兼容有問題,但是在靜態(tài)頁面中是沒有問題的,還是值得學(xué)下的!
3.在 WEB 開發(fā)中,會(huì)使用到頁面錨點(diǎn)。HTML 頁面錨點(diǎn)用于鏈接到一個(gè)頁面的某一章節(jié)。W3School 中說到,創(chuàng)建錨點(diǎn)使用 <a> (錨)標(biāo)簽和 name 屬性,但這不是創(chuàng)建頁面錨點(diǎn)的唯一方法。下面簡(jiǎn)要說一下制作 HTML 頁面錨點(diǎn)的兩種方式。
我們可以利用 W3School 的在線測(cè)試工具來進(jìn)行測(cè)試。打開鏈接后的測(cè)試代碼使用的是 <a href=”#C4″> 和 <a name=”C4″>,測(cè)試沒有問題。再將“ <h2> <a name=”C4″>Chapter 4 </a> </h2>”改為“ <h2 id=”C4″>Chapter 4 </h2>” 后進(jìn)行測(cè)試,效果一樣。
說明,制作頁面錨點(diǎn)除了使用 錨點(diǎn)標(biāo)簽 name 屬性之外,還可以使用 id 屬性。錨點(diǎn) <a> 標(biāo)簽中 href 屬性的值為 # 開頭加上目標(biāo)的 name 或 id 的值:
<html>
<body>
<p>
<a href="#method1">頁面錨點(diǎn)方法一</a>
</p>
<p>
<a href="#method2">頁面錨點(diǎn)方法二</a>
</p>
<h2><a name="method1">方法一</a></h2>
<p>使用錨標(biāo)簽的 href 和 name 屬性</p>
<h2 id="method2">方法二</h2>
<p>使用錨標(biāo)簽和 id 屬性</p>
</body>
</html>
1.錨點(diǎn)是網(wǎng)頁制作中超級(jí)鏈接的一種,又叫命名錨記。命名錨記像一個(gè)迅速定位器一樣是一種頁面內(nèi)的超級(jí)鏈接,運(yùn)用相當(dāng)普遍。
英文名:anchor
使用命名錨記可以在文檔中設(shè)置標(biāo)記,這些標(biāo)記通常放在文檔的特定主題處或頂部。然后可以創(chuàng)建到這些命名錨記的鏈接,這些鏈接可快速將訪問者帶到指定位置。
創(chuàng)建到命名錨記的鏈接的過程分為兩步。首先,創(chuàng)建命名錨記,然后創(chuàng)建到該命名錨記的鏈接。
示例代碼
在HTML頁面中適當(dāng)位置定義如下的錨點(diǎn):
<a name="top">這里是TOP部分</a>
<a name="content">這里是CONTENT部分</a>
<a name="foot">這里是FOOT部分</a>
(您可以使用 id 屬性來替代 name 屬性,命名錨同樣有效。[1])
對(duì)于如上錨點(diǎn)的訪問有兩種方法
一種是利用超鏈接標(biāo)簽<a></a>制作錨點(diǎn)鏈接,主要用于頁面內(nèi)的錨點(diǎn)訪問
<a href="#top">點(diǎn)擊我鏈接到TOP</a>
<a href="#content">點(diǎn)擊我鏈接到CONTENT</a>
<a href="#foot">點(diǎn)擊我鏈接到FOOT</a>
另一種方式是直接在頁面地址后面加錨點(diǎn)標(biāo)記,主要用于不同頁面之間的錨點(diǎn)訪問
假如本頁面的地址是http://文件路徑/index.html,要訪問foot錨點(diǎn)只要訪問如下鏈接即可
http://文件路徑/index.html#foot
2.html 錨點(diǎn) 到底是干嗎的?
通俗簡(jiǎn)單地說,比如一篇很長(zhǎng)的文章,你想按分段精確來看,那就可以用到錨點(diǎn)了。
代碼:
<a href="#001">跳到001</a>
...文字省略
<a name="001" id="001" ></a>
...文字省略
其實(shí)錨點(diǎn)只需name就可以可,加id是為了讓它兼容性更好.
href的值要跟name \ i d 一致,前面必須加"#",以上代碼在ie6/7,ff中都可以兼容,但在ie8中就不行。
因?yàn)槲覀冨^點(diǎn)的<a></a>值為空,為不影響美觀我們加個(gè)空格就行了,
如以下代碼,就可以兼容ie8
<a href="#001">跳到001</a>
...文字省略
<a name="001" id="001" > & n b s p </a>
...文字省略
另一問題,想顯示某頁面(如:123.html)的某錨點(diǎn)內(nèi)容呢?
代碼如下
<a href="123.html#001">跳到001</a>
...文字省略
<a name="001" id="001" > & n b s p </a>
...文字省略
這是昨天在做后臺(tái)時(shí)候,想實(shí)現(xiàn)“修改定位”,就把錨點(diǎn)標(biāo)記搬了出來(平常它都被我遺忘)。
但是程序那邊說他們要取值,連接中必須要有“?”或“&”,那這樣我的錨點(diǎn)就不兼容了...
呵呵!以后會(huì)有解決方法的!
雖然在jsp頁面中錨點(diǎn)兼容有問題,但是在靜態(tài)頁面中是沒有問題的,還是值得學(xué)下的!
3.在 WEB 開發(fā)中,會(huì)使用到頁面錨點(diǎn)。HTML 頁面錨點(diǎn)用于鏈接到一個(gè)頁面的某一章節(jié)。W3School 中說到,創(chuàng)建錨點(diǎn)使用 <a> (錨)標(biāo)簽和 name 屬性,但這不是創(chuàng)建頁面錨點(diǎn)的唯一方法。下面簡(jiǎn)要說一下制作 HTML 頁面錨點(diǎn)的兩種方式。
我們可以利用 W3School 的在線測(cè)試工具來進(jìn)行測(cè)試。打開鏈接后的測(cè)試代碼使用的是 <a href=”#C4″> 和 <a name=”C4″>,測(cè)試沒有問題。再將“ <h2> <a name=”C4″>Chapter 4 </a> </h2>”改為“ <h2 id=”C4″>Chapter 4 </h2>” 后進(jìn)行測(cè)試,效果一樣。
說明,制作頁面錨點(diǎn)除了使用 錨點(diǎn)標(biāo)簽 name 屬性之外,還可以使用 id 屬性。錨點(diǎn) <a> 標(biāo)簽中 href 屬性的值為 # 開頭加上目標(biāo)的 name 或 id 的值:
復(fù)制代碼
代碼如下:<html>
<body>
<p>
<a href="#method1">頁面錨點(diǎn)方法一</a>
</p>
<p>
<a href="#method2">頁面錨點(diǎn)方法二</a>
</p>
<h2><a name="method1">方法一</a></h2>
<p>使用錨標(biāo)簽的 href 和 name 屬性</p>
<h2 id="method2">方法二</h2>
<p>使用錨標(biāo)簽和 id 屬性</p>
</body>
</html>
相關(guān)文章
- 在html中設(shè)置錨點(diǎn)定位我知道的有幾種方法,使用id定位、使用name定位、使用js定位,這些方法大家可以參考下2014-05-28
HTML5實(shí)現(xiàn)錨點(diǎn)時(shí)請(qǐng)使用id取代name
HTML5已經(jīng)去掉name屬性,實(shí)現(xiàn)錨點(diǎn)時(shí)請(qǐng)使用id,下面有個(gè)不錯(cuò)的示例支持Chrome,火狐,IE8以上等瀏覽器,新手朋友們可以學(xué)習(xí)下哦2013-09-06- ie,360下html錨點(diǎn)失效,想必有不少朋友遇到過這樣的問題吧,下面為大家講解下具體的解決方法,感興趣的朋友可以參考下哈2013-05-13
- 很少用到錨點(diǎn)的知識(shí),但今天又看到了,就要記錄下來,它同樣也有著如asp傳值一樣的功效,雖然不是那么強(qiáng)打2010-03-04
HTML中錨點(diǎn)的使用_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
什么是HTML錨點(diǎn),錨點(diǎn)應(yīng)該如何用?這篇文章主要為大家詳細(xì)介紹了HTML中錨點(diǎn)的使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-21