html中link标签有什么作用？html中link标签如何使用？

在html代码中link标签是一个很重要的标签，在互联网上几乎每个网页、网站都会使用到link标签，那么html代码中link标签有什么作用？html中link标签又如何使用呢？学会如何使用html代码中的link标签对于我们前端制作是一件很重要的工作，那么下面来看看李涛自留地记载的有关html的link标签的相关内容。

html中link标签有什么作用？

1、链接Css层叠样式表文件

链接Css层叠样式表是link标签在html中最常用，也是最主要的作用。

在html中link标签起到链接或者说是引入Css层叠样式表的作用，正如文章开头所说，link标签对于我们前端页面是一个很重要的标签，如果错误的使用link标签，那么我们将无法正确的加载我们的Css样式层叠表，这样我们的前端页面看上去就特别难看丑陋。在我们引入Css样式表的时候，我们需要在link的url属性中，正确填写Css的链接路径，否则html页面就会出现错位。

2、定义文档与外部资源的关系

link标签出了我们可以连接Css的层叠样式表之外，我们可以规定文档与外部资源的关系，比如当我们设置link的rel属性值为icon的时候，就是告诉浏览器或者是搜索引擎，我们这是一个icon图标；当rel的属性值为nofollow的时候，就是告诉搜索引擎，后面的url是不传递权重的链接；当rel属性值为author的时候，就是告诉搜索引擎，我们这个链接是作者链接，更多关于link标签的属性见下方link标签属性表格具体内容。

link标签有哪些属性？

通常我们在html中常见的link如下代码所示：

<link rel="stylesheet" href="style.css" type="text/css" media="all" >

当然还有一些写的比较简单，直接将rel和href属性填写完整就可以引入Css文件了，那么link标签有哪些属性呢？见下方表格所示：

html中link标签如何使用

在上面也提到了link标签中的一些属性，最主要的就是rel、href属性，以下是新浪网使用link标签的截图：

关于html中使用link标签，其实还是很简单的，现在很多编程编辑器，直接都支持生成现成的html结构代码，我们只需要在head标签中输入link就会直接将link标签内的代码直接生成出来，最主要的是我们将link中的rel和href属性值设置好就OK了，以下是关于link标签使用时因注意的问题。

1、link标签必须在html代码的head标签内使用，可以不限制次数使用。

当引入多个Css时，后面的Css文件与前面的Css文件中如果有相同的选择器名，后面的Css将覆盖前面Css中的选择器设置。比如在link标签中引入了两个不同的Css文件，两个文件中都有.container选择器，且设置有不同的宽度值，那么后面一个Css中的.container选择器中的宽度将替代前面一个Css里的宽度。

2、link标签没有结束标签

link标签是一个自闭合标签，所以link标签不用闭合。

以上就是李涛自留地关于html中的link标签的总结，希望本文记载的关于html中link标签的相关内容能够帮助到您。