Heim  >  Artikel  >  Web-Frontend  >  Einführung in die Verwendung von Ankerpunkten (benannte Anker) in HTML-Webseiten

Einführung in die Verwendung von Ankerpunkten (benannte Anker) in HTML-Webseiten

不言
不言Original
2018-06-05 11:39:445640Durchsuche

Sie müssen mit Ankerpunkten in HTML vertraut sein. Anker sind eine Art Hyperlink in der Webseitenerstellung, auch benannte Anker genannt Nicht verpassen

Die folgenden Informationen wurden aus dem Internet zusammengestellt

1. Ankerpunkt ist eine Art Hyperlink in der Webseitenproduktion, auch benannt genannt Anker Merken . Ein benannter Anker ist ein Hyperlink innerhalb einer Seite, ähnlich einer Schnellsuche, und wird häufig verwendet.
Englischer Name: Anker
Verwenden Sie benannte Anker, um Tags im Dokument festzulegen. Diese Tags werden normalerweise an einem bestimmten Thema oder oben im Dokument platziert. Anschließend können Links zu diesen benannten Ankern erstellt werden, die Besucher schnell zum angegebenen Ort führen.
Das Erstellen eines Links zu einem benannten Anker ist ein zweistufiger Prozess. Erstellen Sie zunächst einen benannten Anker und dann einen Link zum benannten Anker.

Beispielcode

Definieren Sie den folgenden Ankerpunkt an der entsprechenden Stelle in der HTML-Seite:

<a name="top">这里是TOP部分</a> 
<a name="content">这里是CONTENT部分</a> 
<a name="foot">这里是FOOT部分</a>

(Sie können die ID verwenden Attribut statt Namensattribut, benannte Anker sind ebenfalls gültig [1])
Es gibt zwei Methoden für den Zugriff auf die oben genannten Anker
Eine besteht darin, das Hyperlink-Tag 3499910bf9dac5ae3c52d5ede73834855db79b134e9f6b82c0b36e0489ee08ed zu verwenden . Wird für den Ankerpunktzugriff innerhalb der Seite verwendet

<a href="#top">点击我链接到TOP</a> 
<a href="#content">点击我链接到CONTENT</a> 
<a href="#foot">点击我链接到FOOT</a>

Eine andere Möglichkeit besteht darin, die Ankerpunktmarkierung direkt nach der Seitenadresse hinzuzufügen, die hauptsächlich für den Ankerpunktzugriff zwischen verschiedenen Seiten verwendet wird
Wenn diese Seite Die Adresse lautet http://file path/index.html. Um auf den Fußanker zuzugreifen, greifen Sie einfach auf den folgenden Link zu:
http://file path/index.html#foot
2.html-Anker Was Genau darum geht es?
Vereinfacht ausgedrückt: Wenn Sie beispielsweise einen langen Artikel segmentweise genau lesen möchten, können Sie Ankerpunkte verwenden.
Code:

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

Tatsächlich benötigt der Ankerpunkt nur den Namen id, um die Kompatibilität zu verbessern.
Der Wert von href muss mit dem Namen i d übereinstimmen Die Vorderseite muss „#“ hinzufügen. Der obige Code ist mit ie6/7 und ff kompatibel, jedoch nicht mit ie8.
Da der 3499910bf9dac5ae3c52d5ede73834855db79b134e9f6b82c0b36e0489ee08ed-Wert unseres Ankerpunkts leer ist, können wir einfach ein Leerzeichen hinzufügen, um die Ästhetik nicht zu beeinträchtigen

Der folgende Code ist mit ie8 kompatibel

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

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

Der Code lautet wie folgt

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

Das war gestern, als ich am Hintergrund gearbeitet habe. Ich wollte „Positionierung ändern“ implementieren, also habe ich die Ankermarkierung nach außen verschoben (normalerweise). es ist von mir vergessen).
Aber das Programm sagte, dass in der Verbindung ein „?“ oder „&“ stehen muss, um den Wert zu erhalten, also ist mein Ankerpunkt inkompatibel ...
Haha! Es wird in Zukunft eine Lösung geben!
Obwohl es bei JSP-Seiten ein Problem mit der Ankerpunktkompatibilität gibt, gibt es bei statischen Seiten kein Problem und es lohnt sich trotzdem, es zu lernen!
3. Bei der WEB-Entwicklung wird der Seitenanker verwendet. HTML-Seitenanker werden verwendet, um auf einen Abschnitt einer Seite zu verlinken. Laut W3School werden zum Erstellen von Ankern das Tag 3499910bf9dac5ae3c52d5ede7383485 und das Namensattribut verwendet. Dies ist jedoch nicht die einzige Möglichkeit, Seitenanker zu erstellen. Lassen Sie uns kurz über zwei Möglichkeiten sprechen, HTML-Seitenanker zu erstellen.
Zum Testen können wir das Online-Testtool von W3School verwenden. Der Testcode verwendet nach dem Öffnen des Links fcbea58d2faf4985bbb60ccec2038694 und e359a43dd31c2ec0bd100aac4c3f36ab, und im Test gibt es kein Problem. Ändern Sie dann „c1a436a314ed609750bd7c7d319db4da 48851e4b56484cc136ed2820d56732caKapitel 4 5db79b134e9f6b82c0b36e0489ee08ed 2e9b454fa8428549ca2e64dfac4625cd" in „6df6139f728e20ad509be83df8b61d6aKapitel 4 2e9b454fa8428549ca2e64dfac4625cd". Nach dem Test ist der Effekt derselbe.
Beachten Sie, dass Sie beim Erstellen eines Seitenankers zusätzlich zur Verwendung des Namensattributs des Ankertags auch das ID-Attribut verwenden können. Der Wert des href-Attributs im Anchor3499910bf9dac5ae3c52d5ede7383485-Tag ist der Wert, der mit # beginnt, plus dem Namen oder der ID des Ziels:

Copy code

Der Code lautet wie folgt:

<html> 
<body> 
<p> 
<a href="#method1">页面锚点方法一</a> 
</p> 
<p> 
<a href="#method2">页面锚点方法二</a> 
</p> 
<h2><a name="method1">方法一</a></h2> 
<p>使用锚标签的 href 和 name 属性</p> 
<h2 id="method2">方法二</h2> 
<p>使用锚标签和 id 属性</p> 
</body> 
</html>

Verwandte Empfehlungen:

So verwenden Sie mehrere Beispiele zum Parsen von HTML-Formularen

Das obige ist der detaillierte Inhalt vonEinführung in die Verwendung von Ankerpunkten (benannte Anker) in HTML-Webseiten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn