天天看点

css link和@import区别用法html head <link>标签

1、link语法结构

<link href="CSSurl路径" rel="stylesheet" type="text/css" />

实际应用截图:

css link和@import区别用法html head <link>标签

2、@import语法结构

1)、在html中

<style type="text/css">

@import url(CSS文件路径地址);

</style>

css link和@import区别用法html head <link>标签

@import在html中使用截图

2)、在css中

直接使用

css link和@import区别用法html head <link>标签

import在CSS代码或CSS文件中使用截图

本质上两者使用选择区别不大,但为了软件中编辑布局网页html代码,一般使用link较多,也推荐使用link。

<a href="http://www.divcss5.com/rumen/r431.shtml" target="_blank"></a>

什么是link标签?

css link和@import区别用法html head &lt;link&gt;标签

link实例

type 规定被链接文档的 MIME 类,这里是值为text/css

这样就构成了一个完整的link标签

注意link标签因为不像&lt;head&gt;&lt;/head&gt;、&lt;html&gt;&lt;/html&gt;是一对的,解释还需一个斜杠的标签,这里link样式是放在&lt;link&gt;内的。

使用link引用网页收藏夹图标

收藏夹标签样式如下图

css link和@import区别用法html head &lt;link&gt;标签

favicon ico图标截图

ICO图标引人代码如下:

link 标签的内容结构解释

href 值为外部资源地址这里是收藏夹图标地址

rel 定义当前文档与被链接文档之间的关系,这里是外部icon图标属性

type 规定被链接文档的 MIME 类,这里是值为image/x-icon

本文转自wiwi博客51CTO博客,原文链接http://blog.51cto.com/wiwili/1968979如需转载请自行联系原作者

wiwili