创建包含基本链接结构的 HTML 文件
在这一步中,你将学习如何创建一个包含不同类型超链接的基本 HTML 文件。我们将探索在 HTML 文档中构建链接的各种方式。
打开 WebIDE,在 ~/project
目录下创建一个名为 links_structure.html
的新文件。我们将创建一个综合示例,展示不同类型的链接:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>HTML Link Structures</title>
</head>
<body>
<h1>超链接结构</h1>
<!-- 外部网站链接 -->
<h2>外部链接</h2>
<a href="https://www.example.com">访问示例网站</a>
<!-- 内部页面链接 -->
<h2>内部页面链接</h2>
<a href="about.html">关于页面</a>
<!-- 电子邮件链接 -->
<h2>电子邮件链接</h2>
<a href="mailto:[email protected]">发送邮件</a>
<!-- 电话链接 -->
<h2>电话链接</h2>
<a href="tel:+1234567890">联系我们</a>
<!-- 锚点/书签链接 -->
<h2>锚点链接</h2>
<a href="#section1">跳转到第 1 部分</a>
<!-- 下载链接 -->
<h2>下载链接</h2>
<a href="document.pdf" download>下载 PDF</a>
</body>
</html>
关于超链接的关键点:
- 链接使用
<a>
(锚点)标签创建
href
属性指定目标地址
- 不同类型的链接用于不同的目的
- 链接可以指向外部网站、内部页面、电子邮件等
在 Web 浏览器中的示例输出将显示一系列具有不同用途的可点击链接。