CSS中import与link的区别是什么

本篇文章给大家带来的内容是关于css中importlink区别是什么,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

微信截图_20181123160645.png

CSS中import与link的区别

看到淘宝网页中这样写使用的是import,而很多网站都是使用link,当然还有一些页面比较简单,流量很大的网站,是直接将CSS写在html代码中的?他们有什么区别?css用import还是link好?从经典论坛和另外一个网站大概了解了一下

看到淘宝网页中大部分是这样写的

立即学习“前端免费学习笔记(深入)”;

示例代码

@import url("http://www.divcss8.com/home/css/global/v2.0.css?t=20070518.css");

而很多网站使用的都是link

示例代码


而像google 百度 163等网站他们都是直接写在网页中

当然使用链接link和导入import的好处就是易于维护,但当网速比较慢的时候,会出现加载中断的情况,导致页面排版错误

他俩的作用相同

唯一的不同是服务对象不一样

@import 为CSS服务

link是为当前的页服务

经典有网友说 @import会优先执行。

外部引用CSS中 link与@import的区别

这两天刚写完XHTML加载CSS的几种方式,其中外部引用CSS分为两种方式link和@import。

本质上,这两种方式都是为了加载CSS文件,但还是存在着细微的差别。

差别1:老祖宗的差别。link属于XHTML标签,而@import完全是CSS提供的一种方式。

link标签除了可以加载CSS外,还可以做很多其它的事情,比如定义RSS,定义rel连接属性等,@import就只能加载CSS了。

差别2:加载顺序的差别。当一个页面被加载的时候(就是被浏览者浏览的时候),link引用的CSS会同时被加载,而@import引用的CSS 会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式(就是闪烁),网速慢的时候还挺明显(梦之都加载CSS 的方式就是使用@import,我一边下载一边浏览梦之都网页时,就会出现上述问题)。

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

差别4:使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候,只能使用link标签,因为@import不是dom可以控制的。

大致就这几种差别了(如果还有什么差别,大家告诉我,我再补充上去),其它的都一样,从上面的分析来看,还是使用link标签比较好。

以上就是对CSS中import与link的区别是什么的全部介绍,如果您想了解更多有关CSS3教程,请关注PHP中文网。

以上就是CSS中import与link的区别是什么的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1613538.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月24日 03:43:16
下一篇 2025年12月24日 03:43:32

相关推荐

发表回复

登录后才能评论
关注微信