调用css时，用link 和 import url 有什么区别

发布网友发布时间：2022-03-25 23:17

共4个回答

热心网友时间：2022-03-26 00:46

加载css link与@import的区别：

其实 link 与 @import 在显示效果上还是有很大区别的，基本上来看 link 的加在会在页面显示之前全部加在完全，而 @import 会是读取完文件之后加在，所以如果网速很好或很快的情况下，会出现先开始无css定义，而后加载css定义。@import加载页面时开始的瞬间会有闪烁（无样式表的页面），然后才恢复正常（加载样式后的页面），Link没有这个问题。

他们从方法上是一样的，只是在浏览器识别上有点差距，link在支持CSS的浏览器上都支持而@import只在5.0以上的版本有效，而且还能用于浏览器过滤也就是hack的使用，兼容一些老版本的浏览器。所以最好还是使用link通用型更强，但是对于高版本的浏览器，也就是现在的浏览器来说，其实都一样，这是个没有太大意义的区分

热心网友时间：2022-03-26 02:04

link属于XHTML标签，而@import完全是CSS提供的一种方式。
link标签除了可以加载CSS外，还可以做很多其它的事情，比如定义RSS，定义rel连接属性等，@import就只能加载CSS了。

当一个页面被加载的时候（就是被浏览者浏览的时候），link引用的CSS会同时被加载，而@import引用的CSS会等到页面全部被下载完再被加载。

兼容性的差别，由于@import是CSS2.1提出的所以老的浏览器不支持，@import只有在IE5以上的才能识别，而link标签无此问题。

当使用JavaScript控制DOM去改变样式的时候，只能使用link标签，因为@import不是DOM可以控制的。

总结：两者的作用虽然相同，但是在使用的时候，还是建议使用link标签

热心网友时间：2022-03-26 03:39

首页link 和 import的区别：

引入CSS的方法有两种，一种是@import，一种是link

@import url('地址');
<link href="地址" rel="stylesheet" type="text/css" />
现在绝大部分的网站都采用后一种link方式，区别在于
@import先加载HTML，后加载CSS
link先加载CSS，后加载HTML。
所以前者加载网页会出现令浏览者以外的格式，后者则是带格式的加载网页

url与link和import不属于一种：在CSS中有用url语法来指定background-image或是其他引用文件中

热心网友时间：2022-03-26 05:30

两者虽然都是外部引用CSS的方式，但是存在以下的区别：

link是XHTML标签，除了加载CSS外，还可以定义RSS等其他事务；

@import属于CSS范畴，只能加载CSS。

link引用CSS时，在页面载入时同时加载；

@import需要页面网页完全载入以后加载，所以会页面会出现错乱的样式。

link是XHTML标签，所以无兼容性问题；

@import是在CSS2.1提出的，低版本的浏览器不支持。

link支持使用Javascript控制DOM去改变样式；

@import不支持。

综上所述，在平时项目中，建议还是使用link标签引用外部css文件。尽量避免使用import。

首页

文章

调用css时，用link 和 import url 有什么区别