Home >Daily Programming >HTML Knowledge >Detailed explanation of the methods and functions of adding hyperlinks and anchors to HTML (with video)
Detailed explanation of the methods and functions of adding hyperlinks and anchors to HTML (with video)
- 藏色散人Original
- 2018-09-11 16:15:208502browse
This article mainly introduces to you Hyperlink anchors in HTMLHow to add settings and what their functions are.
The concepts of HTML hyperlinks and anchors , I believe most of my friends already know it very well, but for newbies who are just getting started with html, how to add html This issue of hyperlink anchor may still be a little unclear. So this article is introduced for novice friends. I hope it will be helpful to those who need it!
Below we will explain it in detail through specific HTML code examples.
The code example for adding hyperlink anchors in HTML is as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<a href="http://www.php.cn">PHP中文网</a>
<a href="#one">第一篇文章</a>
<a href="#two">第二篇文章</a>
<a href="#three">第三篇文章</a>
<a name="one"></a>
<h1>第一篇文章</h1>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<a name="two"></a>
<h1>第二篇文章</h1>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<a name="three"></a>
<h1>第三篇文章</h1>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<a href="">回到顶部</a>
</body>
</html>In this code, we mainly use the in HTML Tag, when we directly add the href="link address to jump to" attribute directly in the a tag, we can implement a text hyperlink. For example, the above code section PHP Chinese website realizes that when you click on the field of PHP Chinese website, you can jump directly to The specified link page.
When we add the name="#anchor name" attribute in the a tag, it means that the anchor link is set. Then in the body text, you can set the anchor point at the specified position, that is, add name="anchor name" in the a tag. Be careful not to add the # symbol here.
Then the above code, the overall effect is as follows:
HTML, so what do you think about anchor links and ordinary hyperlinks You should also have a certain understanding of the difference. The above content is very simple and easy to understand. I hope it will be helpful to friends in need! You can also refer to the corresponding Video Tutorial[Add hyperlinks in HTML and go wherever you want in the anchor page] for reference.
The above is the detailed content of Detailed explanation of the methods and functions of adding hyperlinks and anchors to HTML (with video). For more information, please follow other related articles on the PHP Chinese website!