Home  >  Article  >  Web Front-end  >  Detailed explanation of what html anchors are

Detailed explanation of what html anchors are

PHPz
PHPzOriginal
2017-04-02 09:24:302584browse

Detailed explanation of what html anchors are

The first step in learning web knowledge is definitely HTML. What is the purpose of the anchor point of html?

To put it simply, for example, if you want to read a very long article accurately by segment, you can use anchor points.

Code:

<a href="#001">跳到001</a>
…文字省略
<a name="001" id="001" ></a>
…文字省略

In fact, the anchor point only needs name. The id is added to make it more compatible.

The value of href must be the same as name \ i d Consistent, "#" must be added in front. The above code is compatible in ie6/7 and ff, but not in ie8.

Because the value of our anchor point is empty, we can just add a space so as not to affect the appearance.

The following code can be compatible with ie8

<a href="#001">跳到001</a>
…文字省略
<a name="001" id="001" > & n b s p  </a>
…文字省略

Another question, do you want to display an anchor content of a certain page (such as: 321.html)?

The code is as follows

<a href="123.html#001">跳到001</a>
…文字省略
<a name="001" id="001" > & n b s p </a>
…文字省略

All code display:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>锚点示例</title>
</head>
<body>
<a name="A0" id="A0"></a>
<a href="#A1">网页第一部分</a>
<a href="#A2">网页第二部分</a>
<div style="height:900px; background:#CCCCCC"></div>
<a name="A1" id="A1"></a>1<a href="#A0">返回顶部</a>
<div style="height:900px; background:#999999"></div>
<a name="A2" id="A2"></a>2<a href="#A0">返回顶部</a>
<div style="height:900px; background:#666666"></div>
</body>
</html>


The above is the detailed content of Detailed explanation of what html anchors are. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn