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. php 图像处理类

    <?php/** file: image.class.php 类名为Image 图像处理类,可以完成对各种类型的图像进行缩放.加图片水印和剪裁的操作. http://www.lai18.com ...

  2. Ext 下拉框联动第一次显示不正常的问题

    做下拉框联动,异步加载数据,第一次显示时数据不准确,不要在combo_2的下拉框直接绑定store,在combo_1的改变事件里调用下面的方法 function GetAllCustomerBrand ...

  3. chrome插件:打开新tab时自动打开百度

    下载 安装: 解压到某一目录 如要修改自动跳转链接:修改go.js中的url (function (){ chrome.tabs.getCurrent(function(tab){ chrome.ta ...

  4. mysql 1053错误,无法启动的解决方法

    mysql 1053错误,无法启动的解决方法 windows2003服务器中,服务器重启后Mysql却没有启动,手动启动服务时提示1053错误. 尝试了以下方法,终于解决. 1.在DOS命令行使用 第 ...

  5. zencart低版本由php5.2.17升级PHP5.3环境下错误及解决方案

    方法:有错误或者空白先打开错误提示,ftp看cache错误日志 或者 面板查看错误日志,再对比数据库是否正确,可拿脚本看是否能连接 \cp -r  backipmysql/nlbarb_007li/ ...

  6. YII 常用路径总结

      Yii framework已经定义的命名空间常量 system: 指向Yii框架目录; YII\framework zii: 指向zii library 目录; YII\framework\zii ...

  7. git基本命令--远程

    git clone: # clone到 <本地目录名> $ git clone <版本库的网址> <本地目录名> # 克隆版本库的时候,所使用的远程主机自动被Git ...

  8. echo json数据给ajax后, 需要加上exit,防止往下执行,带上其他数据,到时ajax失败

    01返回json数据给ajax后需要加上exit.返回json数据前不能有其他输出 function apply(){ if(IS_POST){$info['status'] = 1; echo js ...

  9. ios 烟花 火焰 雨水 雪花等特效属性

    CAEmitterLayer *snowEmitter = [CAEmitterLayer layer]; //例子发射位置 snowEmitter.emitterPosition = CGPoint ...

  10. postfix队列管理

    队列管理单元的服务器程序--qmgr,是整个postfix系统的中心枢纽.所有邮件,包括等待送出与从外界收进来的,都必须通过队列.了解队列的运行原理以及postfix如何处理队列,有助于你解决问题.  ...