文档章节

CSS中 link 和@import 的区别是?

dong23
 dong23
发布于 2017/09/11 13:53
字数 370
阅读 1
收藏 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
link和@import的区别

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

_大雁
2013/09/26
0
0
CSS基础:@import与link的具体区别

2009-04-15 15:45作者:网页教学网出处:天极网责任编辑:盛晓莹 一般在网页中引用外部CSS有两种方式,即:@import与link。常有人说要使用link来引入CSS更好,本文就简单讲解一下其中的区别。 ...

晨曦之光
2012/03/09
0
0
css link和@import区别用法

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

科技探索者
2017/11/09
0
0
css中import与link用法区别

方式: 引入CSS的方法有两种,一种是@import,一种是link @import url('地址');//注意,这种方式可以放在页面也可以放在css文件中 区别: 1:link是XHTML标签,除了加载CSS外,还可以定义RSS...

easonjim
2016/12/20
0
0
WEB前端学习面试常见问题:link和import的区别

Web前端开发工程师是一个很新的职业,是从事Web前端开发工作的工程师。主要进行网站开发,优化,完善的工作。网页制作是Web 1.0时代的产物,那时网站的主要内容都是静态的,用户使用网站的行...

web前端小辰
05/29
0
0

没有更多内容

加载失败,请刷新页面

加载更多

oracle 安装 PL/SQL Developer连接64位Oracle免安装配置

PL/SQL Developer连接64位Oracle 在64位系统上安装64位的Oracle数据库,但是没有对应的64位PL/SQL Developer,此时就不能使用PL/SQL Developer来进行直接连接的,所以要想实现连接还得需要其...

PeakFang-BOK
4分钟前
0
0
裁员寒冬袭来,30岁还在CRUD的Java程序员,拿什么安身立命?

就在近日,智联招聘公布的数据更是侧面印证了很多公司“瘦身”的事实:“2018年第二季度,小微企业用人需求较第一季度平均下降26.6%”。 裁员大潮正滚滚向前,席卷各行各业! 你做好失业的准...

Java填坑之路
6分钟前
0
0
第一章:什么是SpringCloud

第一章:什么是SpringCloud 何为微服务 在了解 SpringCloud之前,我们先来大致了解下 微服务这个概念吧。 传统单体架构 单体架构在小微企业比较常见,典型代表就是一个应用、一个数据库、一个...

DemonsI
12分钟前
0
0
环境搭建之八-- node.js

1.node.js官网下载64位二进制压缩包 node-v8.12.0-linux-x64.tar.xz 2.解压文件 2.1 xz格式文件为 tar格式 xz -d node-v8.12.0-linux-x64.tar.xz 此时文件已经转变为 node-v8.12.0-linux-x64...

imbiao
15分钟前
0
0
JVM调优浅谈

1.数据类型 java虚拟机中,数据类型可以分为两类:基本类型和引用类型。 基本类型的变量保存原始值,即:它代表的值就是数值本身,而引用类型的变量保存引用值。 “引用值”代表了某个对象的...

xtof
19分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部