HTML學習筆記 HTML連結
https://www.w3school.com.cn/html/html_links.asp#tips
建立超連結
标簽
<a href=" " target="_blank" rel="external nofollow" name=" "></a>
1.通過href屬性建立指向另一個文檔的超連結
<html>
<body>
<a href="url" target="_blank" rel="external nofollow" >元素内容可以是圖檔可以是文本</a>
<!---"<"與"a"之間不能有空格 --->
</body>
<html>
2.通過name/id屬性指向本文檔中的某部分,即建錨,name或id的值即錨的命名,同時使用href屬性來确定抛錨的地方。建立多個錨,錨的命名不同。
<html>
<body>
<a href="#mao1" target="_blank" rel="external nofollow" >茶</a>
<br/>
<a href="#mao2" target="_blank" rel="external nofollow" >咖啡</a>
<!--- 利用換行符增加元素内容的距離和空間--->
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<a name="mao1">茶</a>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<a name="mao2">咖啡</a>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</body>
<html>
效果:
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLyMTMxQzMyATMxITNwAjMwIzLc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.gif)
3.在一個文檔中建立指向另一個文檔中的錨
文檔1:<a href="文檔2.html#錨的名稱" target="_blank" rel="external nofollow" ></a>
文檔2:<a name="錨的名字">
例子
html文檔1:練習之連結1.html
<html>
<body>
<a href="練習之連結2.htm#mao" target="_blank" rel="external nofollow" >不秃頭組織</a>
</body>
<html>
html文檔2:練習之連結2.htm
<html>
<head>
</head>
<body >
<h1>不秃頭組織</h1>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<a name="mao">不秃頭組織</a>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>
效果:
4.連結标簽的一些屬性總結
屬性 | 值 |
---|---|
href | url |
name | 随意起名 |
– | – |
target | _top(在原來的網頁上跳轉)、_blank(跳轉到新的網頁) |