HTML学习笔记06-连接

HTML超链接

HTML使用标签<a>来设置文本超链接。

超链接可以是文字，也可以是图片，点击这些内容跳转到新的文档或当前文档的某个部分

代码类似这样：

实例：

<!DOCTYPE HTML>

<html>
<body>
<a href="https:www.baidu.com">百度一下，你就知道</a>
</body>
    
</html>

点击之后，会跳转到百度

HTML连接-target属性

定义被连接的文档在何处打开

将上面的实例修改一下

<!DOCTYPE HTML>

<html>
<body>
<a href="https:www.baidu.com" target="_blank">百度一下，你就知道</a>
</body>
    
</html>

将target属性设置为_blank，连接将在新窗口打开

之前有提到过基本所有元素都可以加上id这个属性

可以理解为这个元素的唯一编号，一般来说同一个HTML文件id是不允许有重复的

超链接带上id这个属性，就可以直接跳转到这个id对应的元素。

<!DOCTYPE HTML>

<html>
<body>
<a href="https://blog.csdn.net/a54288447/article/details/80825125#article_content">回到第一个实例</a>
</body>
    
</html>

上面的代码中，url是这篇文章的地址，article_content是第一个实例的id

带图片的超链接

<!DOCTYPE HTML>

<html>
<body>
<p>创建图片链接:
<a href="http://www.runoob.com/html/html-tutorial.html">
<img  border="10" src="http://www.runoob.com/images/pulpit.jpg" alt="HTML 教程" width="32" height="32"></a></p>

<p>无边框的图片链接:
<a href="http://www.runoob.com/html/html-tutorial.html">
<img border="0" src="http://www.runoob.com/images/pulpit.jpg" alt="HTML 教程" width="32" height="32"></a></p>

</body>
    
</html>

src是图片的地址