看到淘宝网页中这样写使用的是import,而很多网站都是使用link,当然还有一些页面比较简单,流量很大的网站,是直接将CSS写在html代码中的?他们有什么区别?CSS用import还是link好?从经典论坛和另外一个网站大概了解了一下。 
看到淘宝网页中大部分是这样写的

代码如下:

<style type="text/css" media="screen"> 
@import url("http://www.taobao.com/home/css/global/v2.0.css?t=20070518.css"); 
</style> 

而很多网站使用的都是link

代码如下:

<link rel="stylesheet" rev="stylesheet" href="default.css" type="text/css" media="all" /> 

而像google、百度、163等网站他们都是直接写在网页中,当然使用链接link和导入import的好处就是易于维护,但当网速比较慢的时候,会出现加载中断的情况,导致页面排版错误。 
他俩的作用相同 
唯一的不同是服务对象不一样 
@import 为CSS服务 
link是为当前的页服务 
蓝色经典有网友说 @import会优先执行。 
+++++++++++++++++++++++++++++++++++++++++++++++++ 
外部引用CSS中 link与@import的区别 
这两天刚写完XHTML加载CSS的几种方式,其中外部引用CSS分为两种方式link和@import。 
本质上,这两种方式都是为了加载CSS文件,但还是存在着细微的差别。 
差别1:老祖宗的差别 
link属于XHTML标签,而@import完全是CSS提供的一种方式。 
link标签除了可以加载CSS外,还可以做很多其它的事情,比如定义RSS,定义rel连接属性等,@import就只能加载CSS了。 
差别2:加载顺序的差别 
当一个页面被加载的时候(就是被浏览者浏览的时候),link引用的CSS会同时被加载,而@import引用的CSS会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式(就是闪烁),网速慢的时候还挺明显。 
差别3:兼容性的差别 
由于@import是CSS2.1提出的所以老的浏览器不支持,@import只有在IE5以上的才能识别,而link标签无此问题。 
差别4:使用DOM控制样式时的差别 
当使用JavaScript控制DOM去改变样式的时候,只能使用link标签,因为@import不是DOM可以控制的。 
差别5:@import可以在CSS中再次引入其他样式表 
比如可以创建一个主样式表,在主样式表中再引入其他的样式表, 
大致就这几种差别了(如果还有什么差别,大家告诉我,我再补充上去),其它的都一样,从上面的分析来看,还是使用link标签比较好。 

引入CSS的方式有哪些?link和@import的有何区别应如何选择【转载】的更多相关文章

  1. CSS引入的方式有哪些? link和@import的区别是?转载

    CSS引入的方式有哪些? link和@import的区别是? HTML 中引入 CSS 的方式 有 4 种方式可以在 HTML 中引入 CSS.其中有 2 种方式是在 HTML 文件中直接添加 CSS ...

  2. 引入CSS文件的方式,以及link与@import的区别

    一.引入css的方式 在HTML中引入css的方法主要有4种:行内式.内嵌式.链接式和导入式. 1.行内式 <div style="background:yellow;"&g ...

  3. 引入CSS的方式、link和@import的区别

    引入CSS的方式有四种:内联方式.嵌入方式.链接方式.导入方式. 内联方式 内联方式指的是直接在 HTML 标签中的 style 属性中添加 CSS. <div style="back ...

  4. CSS引入的方式有哪些? link和@import的区别是?

    CSS引入的方式包括内联 内嵌 外链 导入 link和@import的区别是 : ①link属于XHTML标签,除了加载CSS外,还能 用于定义RSS, 定义rel连接属性等作用:而@import是C ...

  5. 在HTML中引入CSS的方式

    有 4 种方式可以在 HTML 中引入 CSS.其中有 2 种方式是在 HTML 文件中直接添加 CSS 代码,另外两种是引入 外部 CSS 文件.   ㈠内联方式 内联方式指的是直接在 HTML 标 ...

  6. 引入css的方式

    ---恢复内容开始--- 引入css的样式及link和@import的区别 有3种引入方式 1.内部样式(写在标签内) 2.内联样式 3.外部样式(link @import) 区别: 1.本质区别:l ...

  7. 引入CSS

    前面的话 Web早期,HTML是一种很有限的语言,这种语言不关心外观,它只是一种简洁的小型标记机制.随着Mosaic网页浏览器的出现,网站开始到处涌现.对于页面改变外观的需求增加,于是增加了类似< ...

  8. css学习-css引入&css选择

    一.引入css的方式,一共有4种,我们只需要掌握三种就可以了,@import的方法我们不做掌握 1.第一种引入的方法 <!--1.第一种引入css的方法--> <h1 style=& ...

  9. 前端学习笔记——引入css文件、样式优先级

    CSS样式的引用方式有三种:行间样式表>内部样式表>外部样式表. 如果只有一种样式,那么优先级“由内到外 由近到远” 1.行间样式表--内联方式 内联方式指的是直接在 HTML 标签中的  ...

随机推荐

  1. Hadoop安全(1)——————美团Hadoop安全实践

    http://tech.meituan.com/hadoop-security-practice.html 前言 在2014年初,我们将线上使用的 Hadoop 1.0 集群切换到 Hadoop 2. ...

  2. 关于SSH

    SSH的英文全称是Secure Shell. 传统的网络服务程序,如:ftp和telnet在本质上都是不安全安全安全安全的,因为它们在网络上用明文传送口令和数据,别有用心的人非常容易就可以截获这些口令 ...

  3. 【TOMCAT启动异常】The BASEDIR environment variable is not defined correctly

    <span style="font-size:18px;">The BASEDIR environment variable is not defined correc ...

  4. java核心卷轴之泛型程序设计

    本文根据<Java核心卷轴>第十二章总结而来,更加详细的内容请查看<Java核心卷轴> 1. 泛型类型只能是引用类型,不可以使用基本数据类型. 2. 类型变量含义 E : 集合 ...

  5. hdu1356&hdu1944 博弈论的SG值(王道)

    S-NimProblem DescriptionArthur and his sister Caroll have been playing a game called Nim for some ti ...

  6. linux下快速列出文件列表的方法

    前言 这两天碰到一个很棘手的问题,需要读取出ubuntu系统中某个目录下所有文件,由于服务器中存储的文件实在太多,导致此过程效率十分低下,动辄需要等待一个小时之久,还只是一个目录.于是如何快速获取文件 ...

  7. SQL监测语句

    SELECT top 20 qs.creation_time,last_execution_time,total_physical_reads,total_logical_reads,total_lo ...

  8. slf4j+log4j在Java中实现日志记录

    小Alan今天来跟大家聊聊开发中既简单又常用但必不可少的一样东西,那是什么呢?那就是日志记录,日志输出,日志保存. 后面就统一用日志记录四个字来形容啦. 日志记录是项目的开发中必不可少的一个环节,特别 ...

  9. HashMap实现原理

    学习笔记之HashMap篇,简单学习了解HashMap的实现原理和扩容. 大家都知道HashMap处理数据很快,时间复杂度O(1),那么是怎么做到的呢?那就先了解一下常见数据结构. 一般来说,我们把存 ...

  10. WebApi实现自定义错误日志

    一.Mvc错误处理默认有添加HandleErrorAttribute默认的过滤器,但是我们有可能要捕捉这个错误并记录系统日志那么这个过滤器就不够用了,所以我们要自定义Mvc及Web Api各自的错误处 ...