HTML学习笔记06-连接

HTML超链接

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

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

代码类似这样:

<a href="url">连接文本</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是图片的地址

 

posted @ 2018-06-27 10:33  梦忆安凉  阅读(156)  评论(0编辑  收藏  举报