我最近一直在为一个网站设计打印样式表，我意识到我不知道如何有效地调整它。为屏幕布局设置重载循环是一回事:
更改代码 点 重新加载
但当你试图打印时，整个过程会变得更加艰巨:
更改代码 点 重新加载 打印 斜视打印预览图像 在预览中打开PDF以作进一步检查
我是不是错过了一些工具?WebKit的检查器有“假装这是分页媒体”复选框吗?Firebug(战栗)能施展什么魔法吗?
当前回答
在Chrome的检查器中有一个选项。
打开DevTools检查器(mac: Cmd + Shift + C, windows: Ctrl + Shift + C) 单击位于DevTools面板左上角的Toggle设备模式图标。(windows: Ctrl+Shift+M, mac: Cmd+Shift+M)。 单击浏览器视口右上角的More overrides图标，打开devtools抽屉。 然后，在“模拟”抽屉中选择“媒体”，并选中“CSS媒体”复选框。
这应该能奏效。
更新:DevTools的菜单已经改变。 现在可以通过单击右上角的“三点”菜单找到>更多工具>渲染设置>模拟媒体>打印。
来源:谷歌DevTools page*
其他回答
2019 -更新说明
打开Chrome检查器 从Mac =>选项+命令+ i 从Windows => F12 点击小3点，自定义和控制devTools 选择更多工具 选择呈现 滚动到底部以模拟CSS媒体 从向下箭头选择打印
Chrome的UI从v53开始就不一样了。
我不需要经常使用这个功能，但每当我使用这个功能时，我总是要花很长时间才能弄清楚Chrome团队从我上次燃烧周期试图追踪它到哪里去了。
注意这是。菜单在开发工具窗格，而不是…菜单在Chrome浏览器窗格。
现在向下滚动渲染部分。它通常在底层。
在Firefox(87.0)中，“DOM和样式检查器”有一个用于打印媒体模拟的切换按钮。
它的一个缺点是不能清楚地描绘页面边界。
调试时使用media="screen"在浏览器中显示打印样式表。打印预览视图使用与普通浏览模式相同的渲染引擎，因此您可以使用它获得准确的结果。
在DreamWeaver中有一个工具栏，可以显示你想要的任何渲染选项: 屏幕，打印，手持媒体，投影屏幕，电视媒体，设计时间样式表等。 这是我特别使用的，因为它:立即显示预览只需按下一个按钮。
