Chrome开发者工具就有这个功能。
1.打开您要测试的页面的Chrome开发者工具。
1.打开抽屉（如果尚未打开）。（按Esc键。）
1.打开渲染选项卡。
1.向下滚动到Emulate CSS media type并从选择框中选择print
图片来源：https://developer.chrome.com/docs/devtools/rendering/emulate-css/#emulate-css-media-type-enable-print-preview

Firefox插件名为“Web Developer”（https://addons.mozilla.org/en-US/firefox/addon/web-developer/），它有一个“按媒体类型显示CSS”选项。

你试过Print Friendly谷歌浏览器扩展。
这是一个很好的扩展，它添加了一个按钮，并生成PDF格式的网页点击。希望这可能比您目前的过程更容易。

受Using Rails 3.1 assets pipeline to conditionally use certain css的启发，我找到了一个不同的解决方案，其工作原理如下：

• 在主HTML文件中使用以下样式表指令：

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

• 隔离样式表中的所有规则
• 适合屏幕和打印（样式表：x1月1x）
• 仅适用于屏幕（样式表：（x月1日至1x日）
• 仅适用于打印（样式表：print.css）
• 在测试网页的打印输出时，切换主HTML文件中的样式表：

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

注意第二行和第三行中media="print|screen"的开关。
因此，你现在可以调用你的主HTML文件，看看如果你在正常情况下打印出来会是什么样子。你通常使用的所有工具（Firefox Firebug，Chrome开发工具，Opera DragonFly，...）都可以正常工作，所以你可以检查你的DOM，看到方框，动态更改CSS，然后重新加载你的页面。
对我来说效果很好，如果我会遇到一些缺点，我也会回来记下来。

如果你在单独的文件中指定打印和屏幕CSS规则，你可以使用Chrome开发者工具很容易地做到这一点。加载你的页面并打开开发者工具。在“元素”视图中，编辑media=“print”行，使其显示为media=“all”。
例如，如果链接样式表，如下所示：

<link href="/static/global/css/theme.css" media="all" rel="stylesheet" type="text/css" />
<link href="/static/global/css/print.css" media="print" rel="stylesheet" type="text/css"   />

变更：

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

改为：

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

现在，您的浏览器窗口中的副本将应用打印样式。您可以像浏览任何其他网页一样浏览样式和元素。

我发现，当打印布局需要修改通用样式时，下面的实践对打印样式很有帮助。
1.创建一个使用@media print { }框住打印样式的打印样式表
1.最后应用该样式表
1.处理打印样式时，请临时注解掉构成打印样式的行
1.以您习惯的方式使用Firebug和Web Developer
1.取消对媒体包围的注解
比如：

/* @media print { */

    #sidebar {display:none;}

/* } */