打印友好页面

今天我将讨论打印友好网页，并分享构建打印友好页面的最佳实践。

我们需要打印友好页面，是因为我们的普通页面通常包含图片、背景、不同颜色的文本、菜单和链接等复杂元素。

在开始构建打印友好页面之前，需要记住以下几点规则：

• 设置默认页面大小，例如 A4，并在页脚处注明页面大小。
• 页面应该非常整洁干净，这意味着没有背景色和前景色，使其简单地为黑色和白色。
• 使用 True Type 字体，例如 Times New Roman、Arial、Courier New 等。
• 使用页眉和页脚。
• 在页眉区域使用适当的图片（公司徽标），并在正文中根据需要使用。
• 建议使用 GIF 格式的图片。
• 如果需要提及位置，例如 文件  选项  保存 或指定 URL 路径，请不要使用链接。
• 在 HEAD 标签下添加 Link 标签。

现在，如果您了解了以上几点，就可以开始构建逻辑了。

第一个逻辑

使用 div 标签来分隔数据、菜单和页面横幅（如果您的页面很简单）。您可以使用 CSS 隐藏它们。例如，如果您将页面菜单放在 div 标签 id=menu 中，那么在打印友好页面上，您可以使用 div#menu{display:none} 隐藏菜单。

第二个逻辑

通过一小段代码来处理。将所有可打印的数据放在 div 标签 中，并在点击打印友好页面时，调用一个函数，该函数将读取 div 标签 区域的内容并在另一个窗口中打开。

以下是一个示例

JavaScript 代码

function pagePrint()
{
var divMyArea = document.getElementById( ‘divArea’ );
if( divMyArea.innerHTML != ” )
window.open( ”,” ).document.write( divMyArea.innerHTML + ‘<input type=button onclick="window.print();" value=打印>‘ );
}

注意：如果您想使用打印友好页面打印页面，浏览器默认会打印背景，您需要从工具->选项->高级->在打印类别下勾选“打印背景颜色和图像”选项，手动设置浏览器属性。