超链接标签的应用
链接标签
链接标签
- 文本超链接
- 图像超链接
- 链接的基本格式
<a href="链接路径" target="目标窗口位置">链接文本或图像</a>
- 使用 a 标签作超链接 但 href 才是超链接的灵魂
超链接标签
- 页面间链接：从一个页面跳转到另一个页面
- 锚链接
- 功能性链接
<!--a标签 href:必填，表示要跳转到那个页面 target:表示窗口再哪里打开 _blank:再新标签中打开 _self:在自己的网页中打开
页面间链接
从一个页面跳转到另一个页面
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>链接标签</title> </head> <body> <a href="https://www.baidu.com" target="_self">更多内容访问百度</a> <a href="1.我的第一个网页.html" target="_self">更多内容访问百度</a> </body> </html>
当输入超链接的网址有下划线标识时，说明网页输入完整可以放访问
在超链接中嵌套img标签可以实现图片超链接跳转
<a href="1.我的第一个网页.html" target="_self">访问我的第一个网页 <img src="../resources/images/1.jpg" alt="打开图片失败" width="300"> </a>
锚链接
<!--锚标签 类似与 goto 语句--> <a name="top">顶部</a> <hr> <a href="1.我的第一个网页.html"> <img src="../resources/images/1.jpg" alt="图片失效" width="300" title="打开有惊喜"> </a> <br> <img src="../resources/images/1.jpg" alt="测试" width="300"><br> <img src="../resources/images/1.jpg" alt="测试" width="300"><br> <img src="../resources/images/1.jpg" alt="测试" width="300"><br> <img src="../resources/images/1.jpg" alt="测试" width="300"><br> <hr> <a href="#top">回到顶部</a>
实现QQ推广
![[HTML、CSS]知识点](https://ucc.alicdn.com/3mfxe2r26qbaq/developer-article1635461/20241109/bcc34220ff734707ab00ebc739596dff.jpeg?x-oss-process=image/resize,h_160,m_lfit)