文档章节

CSS中 link 和@import 的区别是?

dong23
 dong23
发布于 2017/09/11 13:53
字数 370
阅读 66
收藏 0

#程序员薪资揭榜#你做程序员几年了?月薪多少?发量还在么?>>>

1.导入的语法不相同

link (链接式)语法为:

<link rel="stylesheet" href="style.css" type="text/css"/>

@import (导入式)语法为:

<style type="text/css">

@import url("style.css");

</style>

2.  link 和 import 语法结构不同,前者 <link> 是 html 标签,只能放入 html 源代码中使用, link 标签除了可以加载 CSS 外,还可以做很多其它的事情,比如定义 RSS ,定义 rel 连接属性等, @import 看作为 css 的样式,就只能加载 CSS 了;

3.使用 link 方式,浏览器将 CSS 文件和 HTML 的主体部分一同装载,所以显示出来的页面从开始就是带样式效果的;而采用 @import 方式,浏览器则会先装载完整个 HTML 文件后再装载 CSS 文件;

4.当使用 Javascript 控制 DOM 去改变样式的时候,只能使用 link 方式,因为 @import 眼里只有 CSS ,不是 DOM 可以控制的;

5link 是 XHTML 标签,无兼容问题; @import 是在 CSS2.1 提出的,低版本的浏览器不支持


实验得出,@import一定要放在样式表的前面,不管是内部样式还是外部样式,都要放在前面,而且这个在css权威指南上也明确指出了。如果放在末尾就会被浏览器忽略。而如果正确使用这三种类型的样式,只是会产生样式覆盖问题,而没有权重优先问题,测试浏览器Chrome

© 著作权归作者所有

dong23
粉丝 0
博文 10
码字总数 1763
作品 0
私信 提问
加载中

评论(0)

css引入的两种方法link和@import的区别和用法

link和@import都是HTML中引入CSS的语法单词。 两者的基本语法 link语法结构 <link href="外部CSS文件的URL路径" rel="stylesheet" type="text/css" /> link标签通过URL路径引入外部的CSS文件......

osc_o8pkds53
2019/02/14
1
0
vue 中css文件引入问题

css外部文件引入: ###全局引用在main.js文件中 import './style/reset.css' 以下参考:https://blog.csdn.net/weixin39941429/article/details/80254724 ###首先是有关@import的问题,一般的......

osc_320iuulz
2019/10/20
1
0
css link和@import区别用法

1、link语法结构 实际应用截图: 使用link标签截图 Html link标签说明 此标签是引入CSS文件link标签,只要设置好路径即可。 扩展阅读:html link 2、@import语法结构 @import + 空格+ url(CSS...

科技探索者
2017/11/09
0
0
css中导入样式表和链接样式表有什么区别,我不是问语法,而是问内在区别,还有我怎么才能体会到他们的区别

link标签是属于xhtml范畴,而@import则是css2.1中特有的。link标签除了可以加载CSS外,还可以做很多其它的事情,比如定义RSS,定义rel连接属性等,@import就只能加载CSS了。 2. 加载的顺序的...

小炒花生米
2012/03/01
0
0
link和@import的区别

页面中使用CSS的方式主要有3种:行内添加定义style属性值,页面头部内嵌调用和外面链接调用,其中外面引用有两种:link和@import。外部引用CSS两种方式link和@import的方式分别是: XML/HTML...

_大雁
2013/09/26
128
0

没有更多内容

加载失败,请刷新页面

加载更多

python设置搜索路径,以及外层文件调用时路径变动问题

通过sys.path设置路径 import syssys.path.append("待加入的搜索路径") 修改python环境变量 编辑 ~/.profile 文件:export PYTHONPATH= $PYTHONPATH:搜索路径临时修改方法:直接在命令...

hc321
22分钟前
7
0
一个开源的跨平台音乐播放与音乐下载器

跨平台的音乐播放器 目前国内的linux平台上的音乐播放器不多,除了网易云比较多人使用的。 当然Listen1也是一个不错的选择,真正的跨平台,包括Android/Mac/Win/Linux以及Chrome插件,目前尚...

氷泠
28分钟前
18
0
联盟之畔,算力之颠——超算产业峰会,邀你共享

2020年5月30日,在成都首座万豪酒店,一场关于【算力之巅 超算产业峰会】正在如火如荼进行着,Tokenlnsight联合多位算力界代表人物参与此次峰会,一起探讨挖矿与财富机遇的话题,星际联盟也很...

IPFS星际联盟
32分钟前
12
0
Oracle学习(五) --- 视图、序列、同义词、索引

1、视图 1.1、什么是视图 视图就是一个虚拟表,实体表的映射。 什么时候使用视图 在开发中,有一些表结构是不希望过多的人去接触,就把实体表映射为一个视图。(表结构简化) 在项目过程中,程...

庭前云落
42分钟前
27
0
设置JavaScript函数的默认参数值 - Set a default parameter value for a JavaScript function

问题: I would like a JavaScript function to have optional arguments which I set a default on, which get used if the value isn't defined (and ignored if the value is passed). 我......

javail
45分钟前
23
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部