使用link与@import引入css文件用法区别
来源:互联网 发布:天堂伞淘宝官方旗舰店 编辑:程序博客网 时间:2024/06/07 05:31
页面导入外部css文件的方法通常有两种,一种在网页中直接link标签加入,另一种在页面中@import引入css文件。两种引入形式如下:
link引入形式:
<link href="styles.css" type="text/css" />
@import引用形式:
<style type="text/css">@import url("styles.css");</style>
两者差别:
1 适用范围不同
@import可以在网页页面中使用,也可以在css文件中使用,用来将多个css文件引入到一个css文件中;而link只能将css文件引入到网页页面中。
2 功能范围不同
link属于XHTML标签,而@import是CSS提供的一种方式,link标签除了可以加载CSS外,还可以定义rel连接属性,定义RSS等,@import就只能加载CSS。
3 加载顺序不同
页面被加载的时候,link引用的CSS会同时被加载,而@import引用的CSS会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式(就是闪烁)。
4 兼容性
由于@import是css2.1提出的,所以老的浏览器不支持,@import只有在IE5以上的才能识别,而link标签无此问题。
5 控制样式时的差别
使用link方式可以让用户切换CSS样式.现代浏览器如Firefox,Opera,Safari都支持rel=”alternate stylesheet”属性(即可在浏览器上选择不同的风格),当然你还可以使用Javascript使得IE也支持用户更换样式。
6 使用DOM控制样式时的差别
当使用JavaScript控制DOM去改变样式的时候,只能使用link标签,因为@import不是DOM可以控制的。
0 0
- 使用link与@import引入css文件用法区别
- 使用link或@import引入css文件的区别
- link和@import引入css文件的区别
- CSS引入方式以及<link>与@import区别
- css 样式引入的方法 link 与import的区别
- 浅谈css引入方式:link与@import的区别
- link引入样式与import的区别
- css引入link和@import引用css文件方法的区别
- css link和@import区别用法
- css link和@import区别用法
- HTML5中link和@import引入外部CSS文件的区别
- link和@import都可以为页面引入 CSS 文件,其区别是?
- CSS的四种引入方式 import与link的具体区别
- @import和link 引入css的区别(收藏)
- CSS引入的方式link和@import的区别
- CSS引入的方式以及 link和@import的区别
- CSS引入方式及link和@import的区别是?
- CSS引入方法中link和@import方法的区别
- Graveyard UVALive
- Android 1000实例代码集结(二 )
- tensorflow因为版本,需要修改一些方法问题
- Python中进程的理解
- 5.lvm
- 使用link与@import引入css文件用法区别
- js网页访问的浏览器及移动端的判断
- AndFix的简单使用
- 安装setuptools+pip
- Improving the way neural networks learn
- SQL后台传参
- sql优化部分总结
- jedisPool相关参数说明
- TextToSpeech将文本转为语音的简单使用