简单介绍CSS设置打印页面的方法及css里media的使用

简单介绍简单介绍CSS设置打印页面的方法及设置打印页面的方法及css里里media的使用的使用

主要介绍了基于CSS设置打印页面简单介绍及css里media的使用 的相关资料,需要的朋友可以参考下

在很多是时候往往要打印网页中的某一部分，而不是全部网页，所以告诉打印机要打印的部分，使用css进行一下设置是一个

比较好的方式，先看一段代码:

复制代码

代码如下:

<link href="css/screen.css" rel="stylesheet" type="text/css" media="screen" />

<link href="css/print.css" rel="stylesheet" type="text/css" media="print" />

复制代码

代码如下:

/* 隐藏不打印项 start */

h1 span{

display:none;

}

#sidebar{

display:none;

}

/* 隐藏不打印项 end */

css里里media的使用的使用

我们在网页里引用外部的css文件时，通常是用如下的代码：

复制代码

代码如下:

<link rel="stylesheet" type="text/css" href="mycss.css">

实际上，上面的link对象里，我们是省略了一个叫“media”的属性，这个属性指定样式表规则用于指定的设备类型。它有如下值它有如下值

可用：可用：

all-- 用于所有设备类型

aural-- 用于语音和音乐合成器

braille-- 用于触觉反馈设备

tv-- 用于电视类设备

这么多的值，并不是每个都可用，因为浏览器厂商并没有全部实现它们。

在IE里面，可用的值有all，print，screen三个。上面的代码里，我们没有使用“media”，实际上IE或其他浏览器是用了“all”这个

值。“screen”，用于显示器，也就是我们一般看到的效果。“print”，用于打印的效果。

也就是说，我们没有指定“media”，那么我们看到的效果和打印的效果，它们用的都是同样的css文件。如果我们指定了一