引入 css 的两种方式 -- link 和 @import 的区别?
程序员文章站
2022-07-03 17:07:52
(1)link 属于 HTML 标签,除了加载 CSS 外,还能用于定义 rel 连接属性等作用;而 @import 只能用于加载 CSS; (2)link 支持使用 js 控制 DOM 去改变样式,而 @import 不支持;(3)@import 是 CSS2.1 提出的,只在 IE5 以上才能被识别,而 link 是 HTML 标签,无兼容问题;(4)@import 在同一个 css 文件里有引用个数限制,大概在 30 个左右,多余的直接忽略;另外,值得注意的是: 1,@i......
(1)link 属于 HTML 标签,除了加载 CSS 外,还能用于定义 rel 连接属性等作用;而 @import 只能用于加载 CSS;
(2)link 支持使用 js 控制 DOM 去改变样式,而 @import 不支持;
(3)@import 是 CSS2.1 提出的,只在 IE5 以上才能被识别,而 link 是 HTML 标签,无兼容问题;
(4)@import 在同一个 css 文件里有引用个数限制,大概在 30 个左右,多余的直接忽略;
另外,值得注意的是:
1,@import 必须放在 css 文件的顶部,如果放在尾部直接无效
2,权重遵循就近原则,link 标签越靠下权重越高,@import 也是,不过 @import 的优先级是一定要比当前所在 css 文件里的 css 规则低的
3,@import 可以嵌套使用,但权重依然遵循就近原则
4,@import 嵌套使用可能会产生白屏时间较长等问题
本文地址:https://blog.csdn.net/Wayne8016/article/details/109353662
上一篇: 前端常用变量名(js篇)
下一篇: Uncaught Error: Call to undefined function imageCreateTruecolor() in ,php7中GD库打不开
推荐阅读
-
Android 启动 Service(startservice和bindservice) 两种方式的区别
-
Android 启动 Service(startservice和bindservice) 两种方式的区别
-
mysql清空表数据的两种方式和区别解析
-
css import与link的区别
-
link和@import的区别
-
uni-app关于自定义iconfont 本地引入 和 线上引入的两种方式
-
一个jsp页面引入另一个jsp页面的三种方式及静态引入和动态引入的区别详解
-
引入CSS 的两种方式:link和@import的区别[转]
-
link和@import的区别
-
python import导入三种方式(导入不同文件夹的文件,window和linux的区别)