link和@import的区别

 

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

XML/HTML代码
<link rel="stylesheet" rev="stylesheet" href="CSS文件" type="text/css" media="all" />   
XML/HTML代码
<style type="text/css" media="screen">   
@import url("CSS文件");   
</style>

两者都是外部引用CSS的方式,但是存在一定的区别:

  区别1:link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。

  区别2:link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。

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

  区别4:ink支持使用Javascript控制DOM去改变样式;而@import不支持。

补充:@import最优写法
@import的写法一般有下列几种:

@import 'style.css' //Windows IE4/ NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别
@import "style.css" //Windows IE4/ NS4, Macintosh IE4/NS4不识别
@import url(style.css) //Windows NS4, Macintosh NS4不识别
@import url('style.css') //Windows NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别
@import url("style.css") //Windows NS4, Macintosh NS4不识别
由上分析知道,@import url(style.css) 和@import url("style.css")是最优的选择,兼容的浏览器最多。从字节优化的角度来看@import url(style.css)最值得推荐。

css link import的更多相关文章

  1. css中import与link用法区别

    方式:引入CSS的方法有两种,一种是@import,一种是link @import url('地址');//注意,这种方式可以放在页面也可以放在css文件中<link href="地址 ...

  2. css学习之LInk & import

    一.用link加载外部样式表 1.放置位置:放在head元素中 2.样式表中只能包含样式规则,不能包含其他标记语言.如出现了标记,会导致其中一部分或全部被忽略. 3.type = 'text/css' ...

  3. css和@import区别用法

    css和@import都是调用外部样式表的方法. 一.用法 (1)link: <link rel="stylesheet" type="text/css" ...

  4. link@import

    1.两者区别 1)link属于XHTML标签,而@import是CSS提供的;2)页面被加载的时,link会同时被加载,而@import引用的CSS会等到页面被加载完再加载; 3)import只在IE ...

  5. link @import区别 src href的区别

    先说页面引入css的四种方式吧 1 在头部写在style里面 2 行内样式 tyle= 3 外部引入 link和@import的区别 link属于XHTML的标签,而@import只是css提供的一种 ...

  6. CSS Link(链接)

    CSS Link(链接) 不同的链接可以有不同的样式. 一.链接样式 链接的样式,可以用任何CSS属性(如颜色,字体,背景等). 特别的链接,可以有不同的样式,这取决于他们是什么状态. 这四个链接状态 ...

  7. css link和@import区别

    1.link语法结构 <link href="CSSurl路径" rel="stylesheet" type="text/css" / ...

  8. css link和@import区别用法

    这里link与@import介绍的是html引入css的语法单词.两者均是引入css到html的单词. 1.link语法结构<link rel="stylesheet" ty ...

  9. CSS中@import与link的具体区别

    我们知道在网页中引用外部CSS有两种方式:@import和link 我们也经常听到有人说要使用link来引入CSS更好,但是你知道为什么吗? 继续往下看 link:link就是把外部CSS与网页连接起 ...

随机推荐

  1. java类中为什么设置set和get方法操作属性

    java程序规范中会建议大家尽量将类中的属性私有化,即定义为private变量,通过设置set和get函数来对属性进行操作.一些人存在这样的疑问,为什么不直接将属性设置为public,以后调用属性时直 ...

  2. 关于array_agg 函数

    今天一个客户问怎样把表中相同键值对应的文本按照一定顺序拼接起来.如果使用SQL实现将非常麻烦,并且效率低下.GP4.1以后提供了一个函数array_agg可以方便快捷,高效的实现该功能 比如原始查询是 ...

  3. hdu_5754_Life Winner Bo(博弈)

    题目链接:hdu_5754_Life Winner Bo 题意: 一个棋盘,有国王,车,马,皇后四种棋子,bo先手,都最优策略,问你赢的人,如果双方都不能赢就输出D 题解: 全部都可以直接推公式, 这 ...

  4. Linked List 实例

    文件功能:实现了动态建立一个学生信息的链表包括链表的创建.插入.删除.和打印输出学生信息包括姓名和分数 #include<iostream> #include<string> ...

  5. git的理念

    一个很好的git教程:http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000 1  集中式 ...

  6. 妙用transform

    往前移动 transform.Translate transform.Translate( transform.up* speed*Time.deltaTime , Space.World); 移动t ...

  7. iOS 上架提示ipad需要显示四个方位,而我们只能竖屏的时候的解决办法

    勾选requires sull screen

  8. 为PO手写添加配置文件(hbm.xml)

  9. HTML之组件margin、padding

    1.  HTML之组件可以通过CSS里的width height进行大小控制 2.HTML之组件可以通过CSS里的margin.padding进行组件和组件间的间距 margin/padding:(u ...

  10. 创建zend framework 项目要注意的

    1.必须要设置变量环境 我的电脑右击-属性-高级-环境变量 则在环境变量中添加 变量名:PATH 环境值:D:\phpserver\php5.4;D:\ZendFramework\bin 把php.e ...