@import url("example.css"); " />
24小时服务热线:158 8217 0208 咨询热线:028-86521698
新闻中心网站专题联系我们
公司新闻 行业新闻 网络营销 网页设计 网站优化
易域在线

成都网站建设
引用Css的几种方式及CSS Media属性

易域在线:2015-03-25 22:59:47     阅读数:    分享到:

引用Css的几种方式:                                                       

一、@import

 @import url("example.css");

 二、link

 

 

link与@import的区别

这两种方式都是为了加载CSS文件,但还是存在着细微的差别。

 

差别1:老祖宗的差 别。link属于XHTML标签,而@import完全是CSS提供的一种方式。@import 可以写在css文件内,用于引入另外的css文件,格式为:@import url("example.css")screen[, print[,...]];

 

link标签除了可以加载CSS外,还可以做很多其它的事 情,比如定义RSS,定义rel连接属性等,@import就只能加载CSS了。

 

差别2:加载顺序的差别。当一个页面被加载的时候 (就是被浏览者浏览的时候),link引用的CSS会同时被加载,而@import引用的CSS 会等到页面全部被下载完再被加载。所以有时候浏览 @import加载CSS的页面时开始会没有样式(就是闪烁),网速慢的时候还挺明显(梦之都加载CSS 的方式就是使用@import,我一边下载一边 浏览梦之都网页时,就会出现上述问题)。

 

差别3:兼容性的差别。由于@import是CSS2.1提出的所以老的浏览器不支 持,@import只有在IE5以上的才能识别,而link标签无此问题。

 

差别4:使用dom控制样式时的差别。当使用 javascript控制dom去改变样式的时候,只能使用link标签,因为@import不是dom可以控制的。

 

CSS Media属性                                                                 

screen:指计算机屏幕。
print:指用于打印机的不透明介质。
projection:指用于显示的项目。
braille:盲文系统,指有触觉效果的印刷品。
aural:指语音电子合成器。
tv:指电视类型的媒体。
handheld:指手持式显示设备(小屏幕,单色)
all:适合于所有媒体。

 

如果对部分样式指定梅特类型,写法如下:

 1 @media screen {
 2   div.bottom {
 3     background-color: lightblue;
 4     position: fixed;
 5     bottom: 0px;
 6     left: 0px;
 7     right: 0px;
 8     height: 20px;
 9   }
10}
11 @media print {
12   div.bottom {
13     position: absolute;
14     top: 0px;
15   }
16}


上一篇:
下一篇:
最新案例
最新签约
  1. 金酉建筑劳务网站制作案例
  2. 全国煤化工标准化技术委员会网站制作
  3. 瑞地玛医学科技有限公司网站
  4. 成都金口才培训学校网站制作
  5. 思博海企业管理咨询网站案例
  6. 成都佳鸿印刷有限公司
网络营销
  1. 营销型网站如何实现营销?
  2. 2015年中成都小企业网络营销存在的问题
  3. 推广在网站之外的网络营销
  4. 成都企业做网站如何让百度竞价更省钱效果更大?
  5. 网页设计原则理念以及实战经验技巧
  6. 网站为什么要进行网站备案 该怎么操作?
  • 成都易域科技有限公司
    成都市高新区天益街38号(理想中心)
    电话:028-65367116、15882170208
    传真:028-65367118
  • 成都做网站 成都网站维护 网站推广 手机网站
    微信应用开发 手机微信网站
    成都专业网站网络技术开发团队为您服务!
    期待您的合作
15882170202qqsina