Detaillierte Erklärung, was HTML-Anker sind-HTML-Tutorial-php.cn

Detaillierte Erklärung, was HTML-Anker sind

PHPz

Freigeben： 2017-04-02 09:24:30

Original

2615 Leute haben es durchsucht

Detaillierte Erklärung, was HTML-Anker sind

Der erste Schritt beim Erlernen von Webkenntnissen ist definitiv HTML. Wofür ist der Ankerpunkt von HTML?

Vereinfacht ausgedrückt: Wenn Sie beispielsweise einen sehr langen Artikel segmentweise genau lesen möchten, können Sie Ankerpunkte verwenden.

Code:

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

Nach dem Login kopieren

Tatsächlich muss der Name des Ankerpunkts hinzugefügt werden, um die Kompatibilität zu erhöhen.

Der Wert von href muss sein Der gleiche Name wie i d ist konsistent und „#“ muss vorangestellt werden. Der obige Code ist in ie6/7 und ff kompatibel, jedoch nicht in ie8.

Da der -Wert unseres Ankerpunkts leer ist, können wir einfach ein Leerzeichen hinzufügen, um die Ästhetik nicht zu beeinträchtigen.

Der folgende Code ist kompatibel mit ie8

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

Nach dem Login kopieren

Noch eine Frage: Möchten Sie einen bestimmten Ankerinhalt einer bestimmten Seite anzeigen (z. B. 321.html)?

Der Code lautet wie folgt

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

Nach dem Login kopieren

Alle Codeanzeigen:

<!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>

Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonDetaillierte Erklärung, was HTML-Anker sind. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!