文档章节

CSS中 link 和@import 的区别是?

dong23
 dong23
发布于 2017/09/11 13:53
字数 370
阅读 1
收藏 0
点赞 0
评论 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

CSS基础:@import与link的具体区别

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

晨曦之光 ⋅ 2012/03/09 ⋅ 0

css link和@import区别用法

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

科技探索者 ⋅ 2017/11/09 ⋅ 0

css中import与link用法区别

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

easonjim ⋅ 2016/12/20 ⋅ 0

WEB前端学习面试常见问题:link和import的区别

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

web前端小辰 ⋅ 05/29 ⋅ 0

CSS应该定义在哪里

一 在网页中使用CSS有3种方法: 二 样式的优先级 在元素中直接定义CSS的优先级最高,其次是在头部调用CSS样式,最后是从外部文件中调用CSS样式 元素中直接定义CSS --> 在头部调用CSS样式 --...

雪之丞 ⋅ 2013/02/20 ⋅ 0

import和link的区别详情

import和link都是属于引用外部的但是,她们还是有区别的: 1、link是属于XML标签,除了引用css还可以引用别的RSS,而import是属于css语句的只能用来加载css。 2。link引用CSS时,在页面载入时...

再见ds ⋅ 2013/01/07 ⋅ 0

爱创课堂每日一题八十九天- CSS中link和@import的区别是:

Link属于html标签,而@import是CSS中提供的br/>在页面加载的时候,link会同时被加载,而@import引用的CSS会在页面加载完成后才会加载引用的CSS @import只有在ie5以上才可以被识别,而link是h...

全栈web笔记 ⋅ 01/15 ⋅ 0

外部引入CSS 的两种方式link和@import的区别

本质上,这两种方式都是为了加载CSS文件,但还是存在着细微的差别。 老祖宗的差别。link属于XHTML标签,而@import完全是CSS提供的一种方式。link标签除了可以加载CSS外,还可 以做很多其它的...

红薯 ⋅ 2010/04/20 ⋅ 1

【CSS】【2】HTML引入CSS的四种方式

一、行内式 1、样例: 行内式引入CSS 2、效果: 仅对此 标识有效,即“行内式引入CSS”在网页中以蓝底白字显示 二、内嵌式 1、样例: 2、效果: 网页中所有的 标识内容均是以蓝底白字显示 三...

技术小胖子 ⋅ 2017/11/09 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

内核线程、轻量级进程、用户线程

线程与进程概念 在现代操作系统中,进程支持多线程。 进程是资源管理的最小单元; 线程是程序执行的最小单元。 即线程作为调度和分配的基本单位,进程作为资源分配的基本单位 一个进程的组成...

117 ⋅ 31分钟前 ⋅ 0

elasticsearch2.4.6升级为elasticsearch-5.5.0的经历

将elasticsearch-5.5.0 中的配置 path.data 指向原来的数据路径 即 path.data: /usr/local/src/elasticsearch-2.4.6/data 注意: elasticsearch-5.5.0 需要将jdk版本升级到1.8...

晨猫 ⋅ 31分钟前 ⋅ 1

lvm讲解 磁盘故障小案例

1

oschina130111 ⋅ 35分钟前 ⋅ 0

那些提升开发人员工作效率的在线工具

本文转载自公众号 Hollis 作为一个Java开发人员,经常要和各种各样的工具打交道,除了我们常用的IDE工具以外,其实还有很多工具是我们在日常开发及学习过程中要经常使用到的。 Hollis偏爱使用...

时刻在奔跑 ⋅ 48分钟前 ⋅ 0

restful风格 实现DELETE PUT请求 的web.xml的配置

import org.springframework.beans.factory.annotation.Autowired; import org.springframework.http.HttpStatus; import org.springframework.http.ResponseEntity; import org.springframe......

泉天下 ⋅ 53分钟前 ⋅ 0

Shell数组

Shell数组 Shell在编程方面比Windows批处理强大很多,无论是在循环、运算。 bash支持一维数组(不支持多维数组),并且没有限定数组的大小。类似与C语言,数组元素的下标由0开始编号。获取数...

蜗牛奔跑 ⋅ 今天 ⋅ 0

nmap为了开发方便 可以做简单的修改

因为nmap扫描是默认使用的是nse脚本,但是在开发的过程中需要修改后缀(主要是因为后缀为lua才能显示高亮,所以这里用一个取巧的办法) nse_main.lua文件中我们找到如下代码 local t, path = cn...

超级大黑猫 ⋅ 今天 ⋅ 0

springmvc获取axios数据为null情况

场景:前端用了vue没有用ajax与后台通信,用了axios,但是在代码运行过程中发现axios传递到后台的值接受到数据为null。 问题原因:此处的问题在与axios返回给后台的数据为json类型的,后台接...

王子城 ⋅ 今天 ⋅ 0

hadoop技术入门学习之发行版选择

经常会看到这样的问题:零基础学习hadoop难不难?有的人回答说:零基础学习hadoop,没有想象的那么难,也没有想象的那么容易。看到这样的答案不免觉得有些尴尬,这个问题算是白问了,因为这个...

左手的倒影 ⋅ 今天 ⋅ 0

806. Number of Lines To Write String - LeetCode

Question 806. Number of Lines To Write String Solution 思路:注意一点,如果a长度为4,当前行已经用了98个单元,要另起一行。 Java实现: public int[] numberOfLines(int[] widths, Str...

yysue ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部