参考资料

1. HTML 用于著作标题的
2. HTML 内部样式表
3. HTML 自定义列表
4. CSS 实现购物按钮
5. HTML id 属性详解
6. HTML 视频(Videos)播放
7. HTML 字体, 字体颜色 ，字体大小
8. HTML 多媒体

HTML 链接详解

基本标签

<a> 标签用于创建超链接，基本语法：

<a href="URL">链接文本</a>

主要属性

• href：指定链接目标地址（必需）

• target：指定打开方式（如 _blank 新窗口打开）

• title：鼠标悬停时显示的提示文本

• rel：定义链接与当前文档的关系（如 nofollow）

功能类型

1. 外部链接：指向其他网站

   <a href="https://example.com">示例网站</a>

2. 内部链接：指向同一网站内的页面

   <a href="/about.html">关于我们</a>

3. 锚点链接：跳转到页面特定位置

   <a href="#section2">跳转到第二节</a>

4. 邮件链接：打开邮件客户端

   <a href="mailto:contact@example.com">联系我们</a>

5. 电话链接：移动设备拨号

   <a href="tel:+1234567890">拨打电话</a>

CSS 扩展样式

/* 基础样式 */
a {
  color: #0066cc;
  text-decoration: none;
}

/* 悬停效果 */
a:hover {
  color: #ff6600;
  text-decoration: underline;
}

/* 访问过的链接 */
a:visited {
  color: #660099;
}

/* 活动中的链接（点击时） */
a:active {
  color: #ff0000;
}

/* 按钮样式链接 */
a.button {
  display: inline-block;
  padding: 10px 20px;
  background-color: #0066cc;
  color: white;
  border-radius: 5px;
  transition: background-color 0.3s;
}

a.button:hover {
  background-color: #0055aa;
}

高级用法

1. 下载链接：

   <a href="file.pdf" download>下载PDF</a>

2. SEO优化：

   <a href="products.html" title="查看我们的产品" rel="nofollow">产品</a>

3. 安全链接（在新窗口打开时）：

   <a href="https://external.com" target="_blank" rel="noopener noreferrer">外部链接</a>