5、超链接标签

5、超链接标签

超链接标签就是我们常说的a标签

<a href="path" target="目标窗口位置">连接文本或图像a>

一、页面间连接

(一)文字超链接

<a href="1.我的第一个网页.html">跳转到我的第一个网页a>
<a href="https://www.baidu.com">跳转到百度a>

(二)图片超链接


<a href="1.我的第一个网页.html">
    <img src="../resources/image/1.jpg" alt="Dryant" title="悬停文字" width="300" height="300">
a>

二、锚链接

锚链接也是“a标签”,但是他需要配合一些属性来使用,比如回到顶部、回到底部

  1. 需要一个标记:使用a标签的name属性作为标记
  2. 跳转到标记:通过#+标记名字跳转到锚链接位置

需要用“#”来跳转

回到顶部

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接标签学习title>
head>
<body>

<a name="top">a>

<a href="1.我的第一个网页.html">跳转到我的第一个网页a>
<a href="https://www.baidu.com">跳转到百度a>
<br/>


<a href="1.我的第一个网页.html">
    <img src="../resources/image/1.jpg" alt="Dryant" title="悬停文字" width="300" height="300">
a>

<p>
    <a href="1.我的第一个网页.html">
        <img src="../resources/image/1.jpg" alt="Dryant" title="悬停文字" width="300" height="300">
    a>
p>

<p>
    <a href="1.我的第一个网页.html">
        <img src="../resources/image/1.jpg" alt="Dryant" title="悬停文字" width="300" height="300">
    a>
p>
<p>
    <a href="1.我的第一个网页.html">
        <img src="../resources/image/1.jpg" alt="Dryant" title="悬停文字" width="300" height="300">
    a>
p>
<p>
    <a href="1.我的第一个网页.html">
        <img src="../resources/image/1.jpg" alt="Dryant" title="悬停文字" width="300" height="300">
    a>
p>



<a href="#top">回到顶部a>
body>
html>

三、功能性连接

(一)邮件链接

mailto


<a href="mailto:******@qq.com">联系邮箱a>

(二)QQ推广

  1. 搜索QQ推广,上官网
  2. 在推广工具中自动生成a标签源代码

你可能感兴趣的:(HTML,html)