href-Tag in HTML

HTML href wird als Hypertext-Referenz abgekürzt. Dies ist das Attribut, das im Anker-Tag () verfügbar ist. Dieser href wird für Website-URLs wie www.google.com, www.gmail.com, www.facebook.com usw. verwendet.

Echtzeitbeispiel: Im Alltag haben wir auf so viele Websites zugegriffen. Haben Sie jemals darüber nachgedacht, wie wir auf diese Website-URL zugreifen würden? Aufgrund des href-Tags können wir auf beliebige Website-URLs zugreifen. Wir benötigten lediglich eine Website innerhalb dieser doppelten Anführungszeichen (href=“website“) des href-Attributs.

Wie funktioniert das href-Attribut in HTML?

Das HTML-href-Attribut funktioniert basierend darauf, welches href-Tag wir verwenden. Der Zweck aller verfügbaren Href-Tags ist für den Zugriff auf Web-URLs derselbe, es gibt jedoch einen kleinen Unterschied.

Es gibt 4 Tags, die das href-Attribut darin zulassen. Sie sind:

1. : Dieses Tag wird verwendet, um die URL der Seite anzugeben, auf die der Link innerhalb des href-Attributs gehen muss.

Syntax:

<a href="URL%20link"></a>

2. : Dieses Tag wird verwendet, um die URL der Seite anzugeben, auf die der Link innerhalb des href-Attributs gehen muss.

Syntax:

<area href="URL%20link">

 3. : Dieses Tag wird zur Angabe der Basis-URL aller relativen Seiten-URLs verwendet, bei denen der Link innerhalb des href-Attributs stehen muss.

Syntax:

<base href="Base%20URL%20link">

 4. : Dieses Tag wird zur Angabe externer Dateispeicherorte wie „styles.css“, „javascript.js“ usw. im href-Attribut verwendet.

Syntax:

<link href="external%20link">

Beispiele zur Implementierung des href-Tags in HTML

Unten sind die verschiedenen Beispiele:

Beispiel #1 – Tag mit href-Attribut

Code:

<title>href attribute</title>

<!--CSS code-->
<style>
p
{
color: green;
border: 2px solid brown;
font-size: 22px;
}
h1
{
color: blue;
text-align: center;
}
</style>


<h1>The <a> tag with href attribute introduction</a>
</h1>
<p>HTML href is abbreviated as hypertext reference. This is the attribute which is available inside the anchor (<a>) tag. This href is used for website URLs like www.google.com, www.gmail.com, www.facebook.com etc.</a></p>
<p>Real time Example: Day to day life we have accessed so many websites. Have you ever think about how would we access this website URLs? Because of href tag we can access any website URLs. We simply required website within this double quotes (href="website") of href attribute.
</p>
<h1>The <a> tag with href attribute URLs</a>
</h1>

• Duplicate Checker
• EDUCBA
• Google
• Gmail

Ausgabe:

Beispiel #2 – Tag mit href-Attribut

Code:

<title>href attribute</title>

<!--CSS code-->
<style>
p
{
color: fuchsia;
border: 2px solid orange;
font-size: 22px;
}
h1
{
color: red;
text-align: center;
}
</style>


<h1>The <a> tag with href attribute introduction</a>
</h1>
<p>HTML href is abbreviated as hypertext reference. This is the attribute which is available inside the anchor (<a>) tag. This href is used for website URLs like www.google.com, www.gmail.com, www.facebook.com etc.</a></p>
<p>Real time Example: Day to day life we have accessed so many websites. Have you ever think about how would we access this website URLs? Because of href tag we can access any website URLs. We simply required website within this double quotes (href="website") of href attribute.
</p>
<h1>The <area> tag with href attribute URLs Example</h1>
<imgsrc width="150"    style="max-width:90%" alt="href-Tag in HTML" usemap="#educba">
<map name="educba">
<!--Click on this coordinate gives you that images-->
<area shape="rect" coords="0,0,81,125" href="sun.htm">
<area shape="circle" coords="91,59,4" href="mercur.htm">
<area shape="circle" coords="125,59,9" href="venus.htm">

</map></imgsrc>

Ausgabe:

Nach dem Klicken

Beispiel #3 – Tag mit href-Attribut

Code:

<title>href attribute</title>

<!--From this path image is loaded-->
<base href="https://www.w3schools.com/images/">
<!--CSS code-->
<style>
p
{
color: navy;
border: 2px solid blue;
font-size: 22px;
}
h1
{
color: fuchsia;
text-align: center;
}
</style>


<h1>The <a> tag with href attribute introduction</a>
</h1>
<p><img     style="max-width:90%"  style="max-width:90%" src="stickman.gif" alt="href-Tag in HTML" > HTML href is abbreviated as hypertext reference. This is the attribute which is available inside the anchor (<a>) tag. This href is used for website URLs like www.google.com, www.gmail.com, www.facebook.com etc.</a></p>
<p>Real time Example: Day to day life we have accessed so many websites. Have you ever think about how would we access this website URLs? Because of href tag we can access any website URLs. We simply required website within this double quotes (href="website") of href attribute.
</p>

Ausgabe:

Beispiel #4 – Tag mit href-Attribut

Code:

<title>href attribute</title>

<!--Including external CSS styles file with link tag-->
<link rel="stylesheet" type="text/css" href="styles.css">


<h1>The <a> tag with href attribute introduction</a>
</h1>
<p>HTML href is abbreviated as hypertext reference. This is the attribute which is available inside the anchor (<a>) tag. This href is used for website URLs like www.google.com, www.gmail.com, www.facebook.com etc.</a></p>
<p>Real time Example: Day to day life we have accessed so many websites. Have you ever think about how would we access this website URLs? Because of href tag we can access any website URLs. We simply required website within this double quotes (href="website") of href attribute.
</p>

CSS-Code: style.css

p
{
color: red;
border: 2px solid green;
font-size: 22px;
}
h1
{
color: orange;
text-align: center;
}

Ausgabe:

Fazit

hrefin HTML wird verwendet, um auf die Web-URLs zuzugreifen. Es gibt Tags, die das href-Attribut zulassen, das sind , , und . Am häufigsten und Tags werden verwendet.

Empfohlener Artikel

Dies ist eine Anleitung zum href-Tag in HTML. Hier besprechen wir die Einführung in das href-Tag in HTML und seine Beispiele sowie die Codeimplementierung und -ausgabe. Sie können auch unsere vorgeschlagenen Artikel durchgehen, um mehr zu erfahren –

1. Die 15 wichtigsten Eigenschaften des Span-Tags in HTML
2. Wie funktioniert das div-Tag in HTML?
3. HTML-Suchleiste | Beispiele
4. Canvas-Tag in HTML | Beispiele

Das obige ist der detaillierte Inhalt vonhref-Tag in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!