tag href dalam HTML

HTML href disingkatkan sebagai rujukan hiperteks. Ini ialah atribut yang tersedia dalam teg sauh (). href ini digunakan untuk URL tapak web seperti www.google.com, www.gmail.com, www.facebook.com dll.

Contoh Masa Nyata: Kehidupan seharian, kami telah mengakses begitu banyak tapak web. Pernahkah anda berfikir tentang bagaimana kami akan mengakses url laman web ini? Kerana teg href, kami boleh mengakses mana-mana URL tapak web. Kami hanya memerlukan tapak web dalam petikan berganda ini (href=”laman web”) bagi atribut href.

Bagaimana Atribut href Berfungsi dalam HTML?

Atribut href HTML berfungsi berdasarkan tag href yang kami gunakan. Semua tujuan tag href yang tersedia adalah sama untuk mengakses URL web, tetapi terdapat sedikit perbezaan.

Terdapat 4 teg yang membenarkan atribut href di dalamnya. Mereka ialah:

1. : Teg ini digunakan untuk menentukan URL halaman di mana pautan perlu pergi dalam atribut href.

Sintaks:

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

2. : Teg ini digunakan untuk menentukan URL halaman tempat pautan perlu pergi dalam atribut href.

Sintaks:

<area href="URL%20link">

 3. : Teg ini digunakan untuk menentukan URL asas bagi semua URL halaman relatif di mana pautan perlu pergi dalam atribut href.

Sintaks:

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

 4. : Teg ini digunakan untuk menentukan lokasi fail luaran seperti styles.css, javascript.js dsb. dalam atribut href.

Sintaks:

<link href="external%20link">

Contoh untuk Melaksanakan teg href dalam HTML

Di bawah ialah contoh yang berbeza:

Contoh #1 – tag dengan href Atribut

Kod:

<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

Output:

Contoh #2 – tag dengan href Atribut

Kod:

<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="tag href dalam 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>

Output:

Selepas Klik

Contoh #3 – tag dengan href Atribut

Kod:

<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="tag href dalam 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>

Output:

Contoh #4 – tag dengan href Atribut

Kod:

<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>

Kod CSS: styles.css

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

Output:

Kesimpulan

hrefin HTML digunakan untuk mengakses URL web. Terdapat teg yang membenarkan atribut href, iaitu , , dan . Paling kerap dan tag digunakan.

Artikel Disyorkan

Ini ialah panduan untuk teg href dalam HTML. Di sini kita membincangkan Pengenalan kepada tag href dalam HTML dan Contohnya bersama dengan pelaksanaan dan Output kod. anda juga boleh membaca artikel cadangan kami untuk mengetahui lebih lanjut –

1. 15 Sifat Teratas Teg Span dalam HTML
2. Bagaimana Tag div Berfungsi dalam HTML?
3. Bar Carian HTML | Contoh
4. Teg Kanvas dalam HTML | Contoh

Atas ialah kandungan terperinci tag href dalam HTML. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!