資料結構
網路
關係資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 HTML 頁面中插入超連結？
要在 HTML 頁面中插入超連結，我們必須使用錨標籤 <a> 和 </a> 標籤，它們用於定義連結。<a> 標籤表示超連結的開始，< / a> 標籤表示超連結的結束。在這些標籤內新增的任何文字都將用作超連結。在 <a href = " "> 中新增連結的 URL。
以下是超連結的使用示例：
< html> <head> ... </head> <body> -- <a href = " url "> text < / a> </body> </html>
在 HTML 中，所有連結都被視為超連結。這些超連結允許使用者點選並跳轉到另一個頁面/文件。我們不能將文字作為連結，因為它不允許點選。因此，我們需要在文字上使用超連結。
語法
以下是插入 HTML 中超文字的語法：
<a href="url"> Your text for link </a>
示例
在 HTML 中使用不同的連結：
<!DOCTYPE html> <html> <body> <h2>Here is the text Hyperlink</h2> <p><a href="https://tutorialspoint.tw">Text URL</a></p> <h2>Here is the Image hyperlink</h2> <p><a href="https://tutorialspoint.tw/images/cbse-class-6-maths-notes_icon.svg">Dummy image</a></p> </body> </html>
當我們執行上述程式時，我們會看到三個超連結（分別是文字、影像和電子郵件），以及三個標題，每個標題都有一個指定的 URL。
讓我們詳細討論如何插入電子郵件連結、影像連結和文字連結：
使用影像作為連結
我們可以透過簡單地將 <img> 標籤放在錨標籤 <a> 內來使用影像作為連結。
示例
以下示例顯示瞭如何使用影像作為連結：
<!DOCTYPE html>
<html>
<body>
<a href="https://tutorialspoint.tw/statistics/index.htm">
<img src="https://tutorialspoint.tw/images/statistics_icon.svg" alt="HTML tutorial" style="width:300px; height:250px;">
</a>
</body>
</html>
當我們執行上述程式時，我們會看到一個 png 影像，當點選它時，您將被重定向到指定的 URL。
使用電子郵件地址作為連結
要連結電子郵件地址，我們需要在 href 屬性中使用 mailto:，這將開啟使用者的電子郵件程式。
示例
讓我們看一個示例以更好地理解：
<!DOCTYPE html> <html> <body> <h1> Links to Email Address</h1> <p><a href="mailto:abc@example.com">Send Email </a> </p> </body> </html>
當我們執行上述程式時，我們會看到一個帶有“傳送電子郵件”文字的超連結。點選該連結，它將重定向到指定的預設郵件地址，這使使用者能夠直接從網頁傳送郵件。
使用按鈕作為連結
如果您使用按鈕作為連結，請嘗試向其新增一些指令碼程式碼，這有助於我們指定點選按鈕後要執行的操作：
示例
讓我們看一個示例以更好地理解：
<!DOCTYPE html> <html> <body> <h2>Button as a Links</h2> <p>Click the button to go to the tutorialsPoint </p> <button onclick="document.location='https://tutorialspoint.tw/html/html_text_links.htm'">HTML Tutorial</button> </body> </html>
當我們執行上述程式碼時，我們會看到一個標題為“按鈕作為連結”的表單，其中段落元素為“點選按鈕跳轉到 tutorialsPoint”。然後，顯示一個標記為“HTML 教程”的按鈕，點選該按鈕，它將導航到指定的另一個頁面。
點選按鈕後，它將導航到另一個頁面，如下所示：
還有一些匹配特定 URL 的連結：
連結到當前網頁內的特定位置。此語法用於連結到同一頁面上的索引。
<a href="#index">
使用絕對路徑連結到本地機器上的頁面：
<a href="http://www.welcome.com">
絕對路徑始終包含網站的域名，包括 http://。
使用相對路徑連結到同一本地機器上的另一個網頁：
<a href="C:/Users/bhanu/Desktop/index.html">
相對路徑僅指向本地機器上的檔案或檔案路徑。
連結到另一個網站上的網頁
<a href="mypage.html">
此語法用於連結到網頁“mypage.html”。
161K+ 次瀏覽
