Heim  >  Artikel  >  Web-Frontend  >  Tutorial zur Verwendung von Hyperlink-Tags bei der Erstellung von XHTML_HTML/Xhtml_Webseiten

Tutorial zur Verwendung von Hyperlink-Tags bei der Erstellung von XHTML_HTML/Xhtml_Webseiten

WBOY
WBOYOriginal
2016-05-16 16:46:101550Durchsuche


Hyperlink, auch „Link“ genannt. Man kann sagen, dass sich Hyperlinks überall auf den Webseiten befinden, die wir durchsuchen. Wenn wir auf eine Linkadresse auf einer Webseite klicken, wird auf eine andere Webseite verwiesen.
Verwenden Sie das Tag , um einen Hyperlink zu definieren. Syntax:
Angezeigter Text oder Bild
Beispiel:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <a href="http://www .baidu.com/">Link zu Baidua>

Browser-Anzeigeeffekt:
Link zu Baidu
Wenn wir oben auf die Worte „Link zu Baidu“ klicken, leitet der Browser zur Baidu-Homepage weiter.


Hyperlink-Attribut
Hyperlink-Attribut:
href-Link-Adresse. Dabei kann es sich um eine absolute Webadresse oder eine relative Adresse handeln.
Ziel-Link-Ziel. Der Wert _blank öffnet die Linkadresse in einem neuen Fenster. Standardmäßig wird das aktuelle Fenster zum Öffnen der Linkadresse verwendet.
Benennen Sie den Ankerlink, wir werden weiter unten separat darüber sprechen.

Relative Weblink-Adresse:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <a href="/css" Ziel="_blank">DIV-CSS-Tutorial a> 

In diesem Beispiel wird eine relative Adresse verwendet, während im obigen Beispiel, das auf Baidu verlinkt, eine absolute Adresse verwendet wird.

Beispiel für hinzugefügtes Zielattribut:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <a href="http://www .baidu.com/" Ziel="_blank">Link Nach Baidu a>

Wenn Sie erneut auf den Link klicken, ermöglicht der Browser das Öffnen einer neuen Seite unter der Linkadresse, während das ursprüngliche Seitenfenster erhalten bleibt.
Tipps
Wenn eine Linkadresse nicht sehr eng mit dem aktuellen Thema oder Prozess zusammenhängt, ist das Attribut „target="_blank" normalerweise aktiviert. Versuchen Sie andernfalls, kein neues Fenster zu öffnen, um den Zuschauern eine freundlichere Atmosphäre zu bieten Surferlebnis.
Wenn die Seite aus mehreren Seitenrahmen besteht, kann das Zielattribut auch andere Werte haben

E-Mail-Hyperlink
Beispiel für einen E-Mail-Link:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <a href="mailto:admin@xyz .com">Kontaktieren Sie den Webmaster von xyz stationa>

Wenn Sie auf diesen Link klicken, können Sie E-Mails in Ihrem Standard-E-Mail-Client verfassen.

Ankerlink
Ankerlink bezieht sich auf den Link innerhalb der Seite, aber mittlerweile bezeichnen viele Leute auch Text-Hyperlinks als Ankerlinks.
Nehmen wir ein Beispiel, um die Rolle von Ankern zu erklären:
Wir haben zum Beispiel einen gut geschriebenen Artikel und viele Leute haben am Ende des Artikels Kommentare abgegeben, und das Fenster zum Kommentieren befindet sich normalerweise unten des Kommentars. Die Website legt einen Ankerlink fest, auf dem der Kommentar gepostet wird, und entwirft einen Link zu dem Ankerlink, auf dem der Kommentar angezeigt wird, z. B. „Kommentar posten“. Wenn jemand die von anderen hinterlassenen Kommentare nicht sehen möchte und sofort zum Kommentareingabefenster springen möchte, dann klickt er auf „Kommentar posten“, um schnell zum Kommentareingabefenster innerhalb der Branche zu springen. Dieses Design verbessert zweifellos das Benutzererlebnis für die Zuschauer.
Beispiel für die Verwendung eines Ankerlinks
Anker erstellen:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <p><a Name="Kommentar">a >p>

Erstellen Sie eine Hyperlink-Adresse, die auf den Anker verweist:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <p><a href="#comment">Link zum Kommentarankera>p> 

Wie Sie dem Beispiel entnehmen können, fügen Sie zum Zugriff auf einen Anker einfach das „#“-Zeichen und den Namen des Ankers nach der Linkadresse hinzu. Da es sich im obigen Beispiel um einen Anker handelt, der auf diese Seite verlinkt, wird die vorherige Linkadresse ignoriert (Hinweis: Die relative Adresse wird tatsächlich ignoriert und wird hier nicht besprochen).
Tipp
Wenn Sie mit der Verwendung dieses Anker-Tags experimentieren möchten, achten Sie darauf, dass zwischen dem Hyperlink zum Anker und dem Anker-Tag genügend Webspace bleibt, um den Effekt zu sehen. Sie können die Zeilenumbruch-Tags, die wir oben kennengelernt haben, verwenden, um oben und unten genügend Leerraum zum Testen zu schaffen.
Sie können auch ein Anker-Tag erstellen, das auf andere Seiten verweist, zum Beispiel:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <p><a href="http://www.abc.com/#test">Link zum Ankera>p>

Natürlich muss die Seite www.abc.com über das Test-Anker-Tag verfügen, sonst wird nur auf die Seite www.abc.com verlinkt und das Anker-Tag ignoriert.

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