使用css打印之前缩放html表

时间:2015-02-27 04:10:57

标签: css html-table printing-web-page

我有一个表作为HTML文档的整个内容(出于合法的表格目的......它是表数据,而不是布局)。某些单元格指定了宽度和高度(不是通过css,而是在表结构中使用旧的大小调整内联),但整个表格没有指定宽度或高度。这是一个相当大的桌子,但如果有适当的缩放比例(约70%),它可以打印出来,以便很好地贴合在一张纸上。这可以通过在IE,Firefox和Chrome的打印机设置中使用scale page功能来完成。有没有办法扩展整个页面(在我的情况下只是这个表)作为打印样式表的一部分(我知道@media print {}但是那里的语句被忽略了......问题在于正确的命令用于缩放,而不是设置print css)?我可以用这个缩放屏幕视图:

body {
   transform: scale(.7);
}

然而,在打印时,Chrome(和其他人)会忽略我的比例并自动缩放表格以适应纸张的宽度,这会导致我的表格被分割到第二页。我也尝试过这个,但没有成功:

table {page-break-inside: avoid;}

4 个答案:

答案 0 :(得分:11)

您应该使用媒体类型

@media print {
    body {transform: scale(.7);}
    table {page-break-inside: avoid;}
}

因此,此样式仅适用于打印预览模式。 http://www.w3.org/TR/CSS21/media.html

答案 1 :(得分:8)

我最后用百分比大小重写整个表作为类,然后能够缩放页面进行打印。不确定为什么浏览器忽略了我关于转换的打印样式,但是将表从固定大小转换为比例大小使我能够使用CSS扩展它,问题就消失了。

答案 2 :(得分:7)

我知道我已经死了,但是为了将来的搜索结果参考:

我遇到了超宽表的问题导致所有浏览器错误地计算高度并在单页上多次重复thead - 我的解决方案是应用缩放:80%到身体(%根据您的需要而变化)这迫使我们的页面有效地适合打印,然后在每页的顶部正确重复thead。也许尝试缩放将适用于变换没有的地方。

答案 3 :(得分:3)

使用 fread() 对我不起作用。

我的解决方案是将页面大小设置为 A3,即使我希望在 A4 中进行默认打印,以让浏览器在尝试以 A3 打印时缩放我的页面。 A3 的缩放页面非常适合 A4。

scale