HTML href 縮寫為超文本引用。這是錨點(diǎn) () 標(biāo)記內(nèi)可用的屬性。此 href 用于 www.google.com、www.gmail.com、www.facebook.com 等網(wǎng)站 URL。

實(shí)時(shí)示例：日常生活中，我們?cè)L問(wèn)了很多網(wǎng)站。您有沒(méi)有想過(guò)我們?nèi)绾卧L問(wèn)這個(gè)網(wǎng)站的網(wǎng)址？由于有了href標(biāo)簽，我們可以訪問(wèn)任何網(wǎng)站的URL。我們只需要 href 屬性的雙引號(hào) (href=”website”) 內(nèi)有一個(gè)網(wǎng)站。

href 屬性在 HTML 中如何工作？

HTML href 屬性的工作原理取決于我們使用的 href 標(biāo)簽。所有可用的 href 標(biāo)簽的目的都是相同的，用于訪問(wèn) Web URL，但有一些細(xì)微的差別。

有 4 個(gè)標(biāo)簽允許其中包含 href 屬性。他們是：

1。 ：此標(biāo)簽用于指定鏈接必須位于 href 屬性內(nèi)的頁(yè)面的 URL。

語(yǔ)法：

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

2。 ：此標(biāo)簽用于指定鏈接必須位于 href 屬性內(nèi)的頁(yè)面的 URL。

語(yǔ)法：

<area href="URL%20link">

?3. ：此標(biāo)簽用于指定鏈接必須位于 href 屬性內(nèi)的所有相對(duì)頁(yè)面 URL 的基本 URL。

語(yǔ)法：

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

?4. ：此標(biāo)簽用于在 href 屬性中指定外部文件位置，如 styles.css、javascript.js 等。

語(yǔ)法：

<link href="external%20link">

在 HTML 中實(shí)現(xiàn) href 標(biāo)簽的示例

以下是不同的示例：

示例 #1 – 帶有 href 屬性的標(biāo)簽

代碼：

<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

輸出：

示例 #2 – ;帶有 href 屬性的標(biāo)簽

代碼：

<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>
<img src="/static/imghw/default1.png" data-src="planets.gif" class="lazy"    style="max-width:90%"  style="max-width:90%" alt="HTML 中的 href 標(biāo)簽" 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>

輸出：

點(diǎn)擊后

示例 #3 – 帶有 href 屬性的標(biāo)簽

代碼：

<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  src="/static/imghw/default1.png" data-src="stickman.gif" class="lazy"    style="max-width:90%"  style="max-width:90%" alt="HTML 中的 href 標(biāo)簽" > 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>

輸出：

示例#4 – 帶有 href 屬性的標(biāo)簽

代碼：

<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 代碼：styles.css

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

輸出：

結(jié)論

hrefin HTML 用于訪問(wèn) Web URL。允許使用 href 屬性的標(biāo)簽有 、、 等。和。最常見(jiàn)的是和使用標(biāo)簽。

推薦文章

這是 HTML 中 href 標(biāo)簽的指南。在這里，我們討論 HTML 中 href 標(biāo)簽的簡(jiǎn)介及其示例以及代碼實(shí)現(xiàn)和輸出。您還可以瀏覽我們推薦的文章以了解更多信息 –

1. HTML 中 Span 標(biāo)簽的前 15 個(gè)屬性
2. div 標(biāo)簽在 HTML 中如何工作？
3. HTML 搜索欄 |示例
4. HTML 中的畫布標(biāo)簽 |示例

以上是HTML 中的 href 標(biāo)簽的詳細(xì)內(nèi)容。更多信息請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！