第四步：隐藏导航栏和工具条
设计师们设计一种与打印机联系紧密的页面的目的之一在于，要通过消除主要页面内容之外的那些东西，包括导航栏，广告，工具条等。
在输出中，导航按纽并不起什么作用；而那些广告也并没有点击进入功能，至于工具条，它为用户提供一些相关信息之间的链接，以此让页面内容更丰富，不过在打印输出时，往往会适得其反，造成不必要的混乱。
要想将这些因素从该页面中排除掉，关键在于在标记中将它们分隔开来，将它们分成一个个独立的，但可分辨的div。例如，可以将导航栏分在一个名为navbar的div中，样式如下：
div#navBar{
margin: 0 79% 0 0;
padding: 0px;
background-color: #eeeeee;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
你可以用以下的CSS，在该页面中隐藏那个div的内容：
div#navBar {
display: none;
}
在与打印机相连接的页面中，你可以用同样的方法来移动广告，工具条，页眉，页脚，动画，多余的图片，以及其它一些不重要的部份。
第五步：设置宽度和页边空白
隐藏了那些不重要的部份之后，就该设计一下余下的内容了，这样才能让它更便于打印。通常，主要内容都在一个div里面，可能已被设计好了，这样它就能与其它一些诸如导航栏和工具条的元件和平共处，共同分享一个屏幕了。
div#content{
width: 75%;
margin: 10px;
padding: 10px 15px;
}
由于该页面中其它那些元件都已经被排除了，现在我们所要做的，就是设置打印页面中的div，就像这样：
div#content{
width: 100%;
margin: 0pt;
padding: 0pt;
}
设置宽度：100%，这种设置会填充页面上可以打印的部分。当然，你还可以有其它选择，你可以设一个特定的宽度（以英寸），然后采用页边空白和填料，这样，你就可以更好地控制打印输出，不过，如此一来，你就需要仔细考虑，小心测试，以确保你的设置对大多数打印机都有效。
第六步：让内容不可浮动
有些浏览器打印浮动的div的过程中，会有一个麻烦，需要特别加以注意。例如，基于Gecko的浏览器（例如Netscape 6+），当用户用它来浏览一个打印输出页面时，它会截去浮动元素中的内容。这些内容就不会被传送到打印机，下一个页面也不会有它的踪影――它消失了。
值得庆幸的是，对于这个问题，有一个很方便的工作区。在你的打印页面中的还保留着一些div，你仅仅只需移走这些div中的浮动物就行了。通常，在移走了工具条和导航栏之后，页面布局看起来较简洁，你也就不需要那些浮动物了。你可以使用与下面相类似的方法来移走浮动物：
div#content2{
float: none;
}
第七步：检查一下其它那些需要调整的样式
当你完成了前面那些步骤以后，你要特别当心其中的主要变化，要使一个页面与打印机紧密联系起来的话，这些变化是必须的。尽管如此，可能还是有一些会将用户引入歧途的样式，这些应该引起我们的注意。现在，你该启用你的文档和样式表，好好整理一下那些零碎材料了。启动浏览器的Print Preview功能，预览一下你的打印媒体样式表的效果。
本文作者： Michael Meadhra，自Web问世之初便涉足IT行业，目前已出版了30多本书，其中包括How to Do Everything with Dreamweaver MX（Osborne/McGraw-Hill出版）。
