如何使打印与显示用两个样式表(CSS之media使用)

 　　样式表的一个非常实用的特点就是它可以作用于多种媒体，比如屏幕、投影、打印机等等。使特定的属性只能作用于特定的媒体，如我们可以设页面在屏幕显示时用12号字体，当打印时用10号字体。

总结下来使用方式有三：

１.用@import或@media引入：

@import url(loudvoice.css) speech;
@media print {  font-size:10px; } 
@media screen {  font-size:12px; } 

２.在文档标记中引入媒体：

以下是引用片段：
<link rel=”stylesheet” type=”text/css” media=”print” href=”print.css”> 

３.
<style media=print>
  font-size:10px;
</style>
<style media=screen>
  font-size:12px;
</style>
　　可以看出，@import和@media的区别在于，前者引入外部的样式单用于媒体类型，后者直接引入媒体属性。@import的使用方法是@import加样式单文件的URL地址再加媒体类型，可以多个媒体共用一个样式单，媒体类型之间用”，”分割符分开。@media用法则是把媒体类型放在前面，其他规则和rule-set基本一样。下面列出各种媒体类型：

下面是手册的介绍，有点简单

语法：
@media sMedia { sRules }
取值：
sMedia  :　 指定设备名称。请参阅 附录：设备类型 
sRules  :　 样式表定义

说明：
指定样式表规则用于指定的设备类型。此规则无默认值。
请参阅 link 对象的 media 属性(特性)。
示例：
// 设置显示器用字体尺寸
@media screen {
BODY {font-size:12pt; }
}
 
// 设置打印机用字体尺寸
@media print {
@import “print.css”
BODY {font-size:8pt;}
}