如何在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.com">Text URL</a></p> <h2>Here is the Image hyperlink</h2> <p><a href="https://tutorialspoint.com/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.com/statistics/index.htm">
<img src="https://tutorialspoint.com/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.com/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”。
数据结构
网络
关系型数据库管理系统 (RDBMS)
操作系统
Java
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP