请参阅浏览器中的print css

Question

请参阅浏览器中的print css

我想知道如何检查我的打印CSS,就像我用普通的css检查我的元素一样,我看了一遍插件和这样的东西

就像在Chrome中预览打印件一样,但是你能够检查元素

在此输入图像描述

@media print {
   p{color:red;}
   ..... my css
}
.sharebar {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 195;
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
}

Run Code Online (Sandbox Code Playgroud)

Answer 1

and*_*dyb 31

Chrome在DevTools中具有开箱即用的功能 - 请参阅CSS Media Type Emulation.

@Knyri是的,看起来Chrome已经改变了很多,因为这个答案.对于所有版本的Chrome,有一个更好的解决方案是http://stackoverflow.com/questions/9540990/using-chromes-element-inspector-in-print-preview-mode (3认同)
自发布此答案以来，Chrome可能已经发生了变化，但是我看不到任何可以预览打印介质类型的内容。我所看到的只是与移动设备有关的设置。 (2认同)

Answer 2

Mik*_*ike 12

在chrome中执行此操作:

打开开发人员工具
单击"自定义和控制DevTools"汉堡包菜单按钮.
选择更多工具>渲染设置.
选中"渲染"选项卡上的"模拟CSS媒体"复选框,然后选择"打印媒体类型".

这里可以找到非常详细的步骤.

Answer 3

sev*_*cat 7

如果您使用的是Firefox,可以使用Web Developer Toolbar(以及许多其他好东西!)

http://chrispederick.com/work/web-developer/

安装工具栏后,可以在CSS - >按媒体类型显示样式 - >显示打印样式下找到该选项.

归档时间：	12 年，4 月前
查看次数：	31839 次
最近记录：	8 年，11 月前