本文共 5036 字,大约阅读时间需要 16 分钟。
本文翻译自:
I am working on developing a website and need to work on the print view. 我正在开发一个网站,需要处理打印视图。 Typically when I have layout issues I use Chrome's Element Inspector. 通常,当我遇到布局问题时,我会使用Chrome的Element Inspector。 However this does not exist in print preview mode. 但是,这在打印预览模式下不存在。
Is there a Chrome plugin or some other way to change your viewing medium within chrome itself, to view a page as a printer would? 是否有Chrome插件或其他方式来更改Chrome本身的查看媒体,以打印机的形式查看页面? I suppose it doesn't have a be a Chrome specific solution, but that is my primary browser so it would be nice to have an in-browser solution. 我认为它没有特定于Chrome的解决方案,但这是我的主要浏览器,所以拥有一个浏览器内的解决方案会很不错。
Right now I'm focused just on the print preview medium, but it would be ideal to be able to change to any of the supported media types (ie all/braille/embossed/handheld/print/projection/screen/speech/tty/tv). 现在我只专注于打印预览媒体,但是能够更改为任何支持的媒体类型(即所有/盲文/浮雕/手持/打印/投影/屏幕/语音/ tty /电视)。
参考:
Please see 请参阅
Then goto the "overrides" tab 然后转到“覆盖”选项卡
(In Chrome 35+ the "Emulation" tab is present by default. Also, the console is available from any primary tab.) (在Chrome 35+中,默认情况下存在“仿真”选项卡。此外,控制台可从任何主要选项卡中获得。)
This option is not (yet?) available in the console tab. 此选项在控制台选项卡中不可用(尚?)。
Note: This answer covers several versions of Chrome, scroll to see v52 , v48 , v46 , v43 and v42 each with their updated changes. 注意:这个答案涉及铬的几个版本中,滚动查看V52,V48,V46,V43和V42每一个与他们的更新变化。
If you are debugging your CSS using Print As PDF in Google Chrome and your CSS element background colors are not showing, then make sure the 'Background graphics' checkbox is ticked. 如果您使用Google Chrome中的“打印为PDF”调试CSS并且未显示CSS元素背景颜色,请确保勾选“背景图形”复选框。 I spent almost 30 minutes debugging my CSS and wondering what is causing my CSS background being ignored. 我花了差不多30分钟调试我的CSS,并想知道是什么导致我的CSS背景被忽略。
As of Chrome 48+, you can access the print preview via the following steps: 自Chrome 48+起,您可以通过以下步骤访问打印预览:
Open dev tools – Ctrl/Cmd + Shift + I or right click on the page and choose 'Inspect'. 打开开发工具 - Ctrl / Cmd + Shift + I或右键单击页面并选择“检查”。
Hit Esc to open the additional drawer. 点击Esc打开附加抽屉。
If 'Rendering' isn't already being show, click the 3 dot kebab and choose 'rendering'. 如果尚未显示“渲染”,请单击3点烤肉串并选择“渲染”。
Check the 'Emulate print media' checkbox. 选中“模拟打印介质”复选框。
From there Chrome will show you a print version of your page and you can inspect element and troubleshoot like you would the browser version. 从那里Chrome将向您显示页面的打印版本,您可以像浏览器版本一样检查元素和故障排除。
转载地址:http://zncnb.baihongyu.com/