錨點連結怎麼做

不言原創: 2018-12-27 13:49:4537163瀏覽

網頁內容過多時我們可以使用錨點連結來進行位置的跳轉，透過錨點連結我們不但可以指向文檔，還能指向頁面裡的特定段落，這樣就會便於我們來瀏覽網頁中的內容，那麼，錨點連結怎麼實現呢？本篇文章就來跟大家介紹錨點連結的實作方法。

錨點連結怎麼做

方法一：使用id來進行錨點定位

我們來看具體的範例

#程式碼如下

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
<a href="#string">跳转</a>
<hr/>
<br><br><br><br><br>
<br><br><br><br><
<br><br><br>
<br><br>
<br><br>
<br><br>
<br>
<br>
<br>
<a id="string">hello,I&#39;m here!</a>
</body>
</html>

運行效果如下

錨點連結怎麼做

#點擊「跳轉」時會跳到「hello,I'm here !”，效果如下

錨點連結怎麼做

會跳到目前頁面的“hello,I'm here!”。

方法二：使用name屬性來實作錨點連結

#來看具體的範例

程式碼如下

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
<a href="#string">跳转</a>
<hr/>
<br><br><br><br><br>
<br><br><br><br><
<br><br><br>
<br><br>
<br><br>
<br><br>
<br>
<br>
<br>
<a name="string">hello,I&#39;m here!</a>
</body>
</html>

也是當滑鼠點擊「跳轉」時，會跳到目前頁面的「hello,I'm here!」。

以上是錨點連結怎麼做的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：html中id屬性和name屬性的差別是什麼下一篇：html中id屬性和name屬性的差別是什麼

看更多