HTML - Element: <a>

Mit dem <a>-Tag (a = Anker) definieren Sie einen Verweis (Link) zu einer anderen Seite. Der <a>-Tag benötigt noch das Attribut href="" in diesem wird das Ziel (Pfad) des Verweises angegeben. Optional können Sie noch das Attribut: target="_blank" einfügen, das das Ziel in einem neuen Fenster oder Tab öffnet (je nach Browser-Einstellung).
Mit HTML5 darf ein a-Tag um ein oder mehrere Block-Elemente gelegt werden.

<!DOCTYPE html>
<html>
<head>
 <title>Externe Verweise mit absoluter Pfadangabe</title>
</head>
<body>

<h1>Externe Verweise mit absoluter Pfadangabe</h1>

<p>
<a href="https://werner-zenk.de">werner-zenk.de</a> <br>
<a href="https://werner-zenk.de" target="_blank">werner-zenk.de</a> (Neues Fenster oder Tab)
</p>

</body>
</html>

Beispiel anzeigen

Verweise mit relativer Pfadangabe

➤ Die Beispiele für die Pfadangabe gelten nicht nur für Link-Verweise, sondern auch für Bilder und andere Dateien.

Um von einer Datei zu einer anderen Datei zu gelangen geben Sie nur den Dateinamen an:

<a href="seite2.htm">Die zweite Seite</a>

Um von einer Datei zu einer anderen Datei die in einem übergeordneten Verzeichnis liegt zu gelangen, geben Sie "../" und den Dateinamen an:

<a href="../seite2.htm">Die zweite Seite</a>

Um von einer Datei zu einer anderen Datei die in einem untergeordneten Verzeichnis liegt zu gelangen, geben Sie den Verzeichnisnamen "beispiel/" und den Dateinamen an:

<a href="beispiel/seite3.htm">Die dritte Seite</a>

Das folgende Beispiel geht zwei Verzeichnisse nach oben "../../" und dann ins Verzeichnis beispiel/ zur Datei: seite4.htm.

<a href="../../beispiel/seite4.htm">Die vierte Seite</a>

Das folgende Beispiel geht zwei Verzeichnisse nach unten "beispiel/test/" und dann zur Datei: seite5.htm.

<a href="beispiel/test/seite5.htm">Die fünfte Seite</a>

➤ Sämtliche Pfadangaben müssen zu einer existierenden Datei führen.

Verweise innerhalb der Datei

Um Verweise innerhalb der Datei zu erstellen, fügen Sie im Attribut href="" eine Raute (#) und irgend einen Namen hinzu:

<a href="#ende">Zum Ende springen</a>
Am Ziel des Verweises fügen Sie einen Anker ein:
<a id="ende">ENDE</a>
<!DOCTYPE html>
<html>
<head>
 <title>Interner Verweis innerhalb der Datei</title>
</head>
<body>

<h1>Interner Verweis innerhalb der Datei</h1>

<h2>Das Blindtextchen</h2>

<p>
<a href="#ende">Zum Ende springen</a>
</p>

<p>
Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte.
Abgeschieden wohnen Sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans.
Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien.
Es ist ein paradiesmatisches Land, in dem einem gebratene Satzteile in den Mund fliegen... 
(Viel Text!)

<a id="ende">ENDE</a>
</p>

</body>
</html>

Beispiel anzeigen

Attribute

target - Zieladresse
Zieladresse des <a>-Elements in einem neuen Fenster, Tab oder Frame laden.
Mögliche Werte sind:

_self   Lädt die Seite in das gleiche Tab, Browser-Fenster, iframe.
_blank   Lädt die Seite in ein neues Tab, Browser-Fenster.
_parent   Lädt die Seite in ein übergeordneten Browser-Fenster.
_top   Lädt die Seite in die oberste Ebene des Browser-Fensters
Fenster   Lädt die Seite in ein <iframe> mit dem Namen Fenster.
<a href="beispiel/test/seite5.htm" target="_blank">Die fünfte Seite</a>

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Codeschnipseln aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<bdi> Textrichtung

CSS - Pflichtfeld hervorheben

PHP - Eine Ziffer entfernen

JavaScript - Text in Großbuchstaben oder Kleinbuchstaben umwandeln

MySQL - Suchen unter Berücksichtigung von Groß- und Kleinschreibung