文档章节

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

没有更多内容

加载失败,请刷新页面

加载更多

下一页

【七】组合Action

本章描述了常用定义Action的方法。 自定义action builders 我们在action一章已经看过如何声明一个action——有request parameter、无request parameter、有body parser等等。你可以在 asynch...

Landas
33分钟前
0
0
Spring Boot实战之基础回顾

本文作者: 吴伟祥 本文链接: https://wuweixiang.cn/2018/08/21/Spring-Boot实战之基础回顾/ 版权声明: 本博客所有文章除特别声明外均为原创,采用CC BY-NC-SA 4.0 许可协议。转载请在文章开...

吴伟祥
33分钟前
0
0
OAuth认证开发

提示: 以下测试是基于项目安装成功,初始化数据库(initial_db.ddl, oauth.ddl, initial_data.ddl)后的测试, 也可在页面上点击"client_details"菜单里进行测试 方式1:基于浏览器 (grant_type=...

舒文joven
42分钟前
1
0
第二章-对象及变量的并发访问-第二篇

锁对象的改变 请阅读如下代码 public class MainClass { private String lock = "123"; public void printStringB() { try { synchronized (lock) { ......

简心
45分钟前
0
0
日志中记录代理IP以及真实客户端、apache只记录指定URI的日志

apache 日志中记录代理IP以及真实客户端 默认情况下log日志格式为: LogFormat "%h %l %u %t "%r" %>s %b "%{Referer}i" "%{User-Agent}i"" combined 其中%h 是记录访问者的IP,如果在web的前...

李超小牛子
54分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部