网络编程
位置:首页>> 网络编程>> 网页设计>> [翻译]标记语言和样式手册 Chapter 11 打印样式(3)

[翻译]标记语言和样式手册 Chapter 11 打印样式(3)

作者:zhaozy 来源:3user.com 发布时间:2008-02-11 18:44:00 

标签:样式,标记,css,手册,打印

看过两种指定媒体类型的方法之后,接着来看看如何实际以它们提供屏幕显示与打印时使用的样式.

分开屏幕显示与打印的样式

假设我们想为同一份文件提供两份CSS:一个在显示时使用,另一个在打印时使用.现在以我的个人网站作为示范.

我以<link>标签引用整个网站的主体样式表(styles.css).styles.css的内容只是个简单的@import规则,用以引入另一个外部样式表,这样能够对老旧浏览器(像是Netscape 4.x)隐藏样式设定.

在页面的<head>里,链接到主体样式表styles.css

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

同时也建立另一个特别针对打印设计的样式表(print.css).在print.css里,我写了只在页面打印时适用的样式.

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

然后,现在要如何确保这些CSS只会针对各自适合的媒体发挥作用呢?为<link>标签加上media属性就可以了(与方法A一样).

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

通过为styles.css指定screen,就能确保styles.css包含的样式只会对电脑屏幕使用,同样的,把media属性设为print就能确保print.css包含的样式只在使用者打印页面时使用.

0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com