在打印预览模式中使用Chrome的元素检查器?

我正在开发一个网站，需要在打印视图上工作。通常当我有布局问题时，我使用Chrome的元素检查器。但是，这在打印预览模式中不存在。

是否有一个Chrome插件或其他方式来改变你的浏览器本身的观看媒介，以查看一个页面的打印机会?我想它没有一个Chrome特有的解决方案，但那是我的主要浏览器，所以有一个浏览器内的解决方案会很好。

现在我只专注于打印预览媒体，但如果能够切换到任何支持的媒体类型(即所有/盲文/压花/手持/打印/投影/屏幕/语音/tty/电视)将是理想的。

当前回答

Chrome v67 (mac):

按Cmd+opt+j打开开发工具点击…在右边，选择:More Tools >> Rendering 当渲染窗口显示在屏幕底部，模拟CSS媒体部分，并从下拉菜单中选择:“屏幕”。转到“文件>>打印”，你应该看到你想打印的视图。

mac上Chrome v67的上述描述图片:

在哪里找到渲染选项卡:点击…在右边，选择:More Tools >> Rendering

如何获得“屏幕”视图打印:当渲染窗口显示在屏幕底部时，模拟CSS媒体部分，并从下拉菜单中选择:“屏幕”。

希望能有所帮助。

其他回答

有了捷径，最快的方法就是

打开开发人员工具 Windows: F12或Ctrl+Shift+I 麦克:Cmd + Opt + I 打开命令菜单 Windows:按Ctrl + Shift + P 麦克:Cmd + Shift + P 键入打印并从上下文菜单中选择模拟CSS打印媒体类型

看看lmeurs给出的优秀且目前获得最多赞的答案，我认为这个解决方案也可能随着时间的推移保持稳定。

Chrome v50:

方式1:

菜单>更多工具>渲染设置 (见图片) 下:渲染标签>模拟媒体“打印”

方式2:

打开控制台[esc] 控制台菜单>渲染

在Mac上的Chrome v51下，我通过点击右上角的渲染设置，选择更多工具>渲染设置，并在窗口底部提供的选项中检查模拟媒体按钮。

感谢所有其他让我想到这一点的海报，并感谢那些没有图片提供答案的人。

自从Chrome 32，你有CSS媒体选项在屏幕部分的抽屉仿真选项卡。

只需启用它，选择打印作为目标媒体类型，然后-看-你的页面呈现[几乎]它将打印的方式。

如果抽屉不可见，使用Esc键调出抽屉。

请参阅这篇文章

然后转到“覆盖”标签

推荐文章