许多媒体网站的读者都熟悉“适合打印的页面”,比如这个页面。这是文章的一个特殊版本,删除了大多数图形、背景颜色以及广告。许多时候,适合打印的页面放在一个单独的文件中,要专门从Web服务器上获取。
这里和大家分享一个例子,它演示如何使用层叠样式表(css)媒体类型,面向屏幕和打印机来格式化一个HTML文件。
媒体类型说明
利用css的@media规则,可根据显示页面的设备类型来指派具体样式。没必要为每个设备都单独创建HTML文件,只需在一个css文件中创建单独的@media规则。另外,不必向Web服务器发送单独的请求,因为媒体类型切换在客户端完成。
css支持的部分设备包括计算机屏幕、打印机、电视机、手持设备、语音合成器以及盲人触摸反馈设备。但目前大多数浏览器只支持少量可用的媒体类型。Internet Explorer 4.5+和Netscape 4.7+支持屏幕和打印,而Opera 3.67+支持屏幕、打印和投影机。
HTML文件
第一步是打开一个现成的HTML页。图A是本例要使用的不适合打印的网页的一个屏幕截图。清单A提供了代码。注意为便于演示,我们嵌入了样式信息。
图A
一个不适合打印的页