So Verankern Sie HTML

Inhaltsverzeichnis:

So Verankern Sie HTML
So Verankern Sie HTML

Video: So Verankern Sie HTML

Video: So Verankern Sie HTML
Video: Little Boxes – der HTML-Crashkurs Tutorial: HTML-Elemente sichtbar machen |video2brain.com 2024, November
Anonim

Der Anker auf der Site ist sehr nützlich, wenn Sie möchten, dass die Artikel auf Ihrer Site einen bequemen Übergang zwischen den Listenelementen haben. Sie blättern die Seite an die gewünschte Stelle oder öffnen die gewünschte Seite und helfen dem Benutzer, die gewünschten Informationen schnell zu finden.

So verankern Sie HTML
So verankern Sie HTML

Wenn Sie Ihre eigene Site schreiben, sollten Sie darüber nachgedacht haben, wie Sie Ihre Site-Navigation bequemer gestalten können. Damit der Benutzer nicht auf allen Seiten Ihrer Site nach den gewünschten Informationen suchen muss, verwenden Sie am besten die "Anker"-Technik. Es erstellt einen Link zu allen Informationen oder Dokumenten an einer beliebigen Stelle auf Ihrer Website.

Theorie

Um einen Anker zu erstellen, benötigen Sie zwei Elemente:

  • Der Teil des Codes, der den Link zu unserem Anker anzeigt, befindet sich in einem anderen Teil der Website.
  • Jeder Teil des Codes, in dem ein Bezeichner angegeben werden kann, ist unser Anker.

Zuerst müssen Sie den ersten Teil des Ankers erstellen - einen Link dazu. Ein Ankerlink besteht aus zwei Teilen: einem Seitenlink und einem Ankerlink.

  1. Erstellen Sie ein "a"-Tag oder ein anderes Tag, das das "href"-Attribut unterstützt
  2. Erstellen Sie in diesem Tag das Attribut "href"
  3. Geben Sie im Attributwert einen Link zur Site-Seite an.
  4. Geben Sie nach dem Link den Link zum Anker mit dem Symbol "#" und einem beliebigen Namen für den Anker an (zusammengeschrieben, zum Beispiel: "#anker")

Wenn Sie Punkt 3 überspringen und keinen Link zur Site-Seite angeben, wird der Anker auf der aktuellen Seite gesucht. Das heißt, wenn Sie einen Link zu einem Anker erstellen möchten, der sich auf derselben Seite befindet, können Sie den Link zur Seite selbst weglassen.

Es bleibt der zweite Teil des Ankers zu erstellen - den Bezeichner. Es bezieht sich auf ein beliebiges Tag im Site-Code, das das id-Attribut unterstützt. Um einen Anker zu erstellen, benötigen Sie:

  1. Erstellen Sie im erforderlichen Tag ein "id"-Attribut.
  2. Geben Sie im Attribut "id" den Wert des Ankernamens an, der im vorherigen Schritt angegeben wurde. (Beispiel:)

Nach diesen beiden Schritten wird auf der Site ein Link angezeigt, der Sie zum angegebenen Anker führt.

Trainieren

Betrachten wir anhand eines bestimmten Beispiels, wie Sie einen Anker erstellen.

Wir haben eine einfache Seite wie diese:

Bild
Bild

Wir haben Text oben und unten auf der Seite, viele "br"-Tags, die Platz zwischen den Texten schaffen. Wir müssen einen Anker erstellen, damit wir uns den Text unten schnell ansehen können.

Erstellen Sie dazu ein neues Tag - "a" nach der Aufschrift "Text oben". Darin erstellen wir das Attribut "href". Um den Anker bequemer zu machen, werden wir im Link "unten" schreiben.

Bild
Bild

Jetzt geben wir im Attribut den Wert "#yakor" an - dies ist ein Link zum Namen des Ankers.

Bild
Bild

Der erste Teil des Ankers – der Link dazu – ist fertig. Jetzt müssen Sie nur noch den Anker selbst erstellen. Wir gehen zum gewünschten Teil der Seite über. In diesem Fall ist es "Text unten". Da es sich um einfachen Text ohne Tag handelt, müssen wir ihn erstellen. Schließen Sie dazu den Text in einen "Absatz" - Tag "p" ein.

In diesem Tag erstellen wir das Attribut "id" und tragen den Wert "yakor" ein. Der Wert "yakor" entspricht dem im Link angegebenen Ankernamen.

Bild
Bild

Jetzt funktioniert unser Anker wie er soll.

Empfohlen: