我一直使用Firebug和IE开发者工具栏来调试棘手的CSS问题.但偶尔会出现一个棘手的错误,它只在你打印页面时出现.

您使用哪些技术/工具来诊断此类问题?有没有办法在打印视图中更好地利用传统的CSS调试工具?

更新:为了避免浪费纸张,我已经使用了PDF打印机;我的问题是无法右击打印的DOM.下面的一些其他答案很有帮助,谢谢.:-)

推荐答案

在Chrome 51中:

Chrome developer tools

打开devtools(CTRL + F12CTRL + SHIFT + I)并单击...菜单,单击More Tools > Rendering settings打开开发者控制台的Rendering选项卡(或者,如果控制台打开,只需导航到此选项卡).

在该选项卡中, Select 并选中Emulate Media: print复选框.

Css相关问答推荐

需要Angular material 下拉面板有向下和向上箭头按钮

以百分比形式输入的css宽度属性不会生效

如何仅使用CSS Select 器根据列表中第n个项的子项属性 Select 该项

如何在CSS中创建水平/垂直对称的虚线边框?

用两步函数内插的css动画值

仅 Select 嵌套 div 的底部,而不知道它们的嵌套程度

如何让 v-col 变成可滚动的?

为什么所有选项卡都没有显示在 React 的 MUI 选项卡组件中?

更改 20 个实例中的一个组件的样式

Bootstrap 5 - 更改列顺序时出现问题

循环一个 sass/scss 变量以生成 css 变量

宽度为 x VW 的元素似乎对窗口调整大小没有react

在表格中使用自动换行:断词

在固定高度的输入字段中垂直对齐文本而不显示:表格或填充?

如何通过 JavaScript 重新触发 WebKit CSS 动画?

如何使用 Bootstrap 3 阻止按钮保持压抑状态

如何填充 100% 的剩余高度?

如何保持标题静态,滚动时始终位于顶部?

为什么浏览器会为 CSS 属性创建供应商前缀?

可变高度的 CSS 浮动 div