css - 使用 Bootstrap 网格强制打印布局的视口(viewport)大小

标签 css twitter-bootstrap printing

我的页面在 @screen-tablet 处呈现从水平到垂直的形式,大约 760px。 A4 页面宽度约为 ~600px

在我的 print.css 中,我缩小了所有文本,例如 font-size:85% 这样所有默认字体大小为 14 的字体将以 12 左右打印.我也想显示格式 它是水平状态,意思是 - viewport > 760px。问题是打印布局将页面宽度设置为 A4 ~600px,导致表单垂直显示。

有什么方法可以“欺骗”布局,使其认为它大于 760 像素?

(我希望得到一个不需要为打印设置全新布局的答案 - 只需让它看起来像在桌面上一样)。

最佳答案

使用 transform带有媒体查询的属性 print类型如:

@media print {
  html {
    transform: scale(0.8);
  }
}

这将允许您在不重排内容的情况下缩放文档。

关于css - 使用 Bootstrap 网格强制打印布局的视口(viewport)大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25460325/

相关文章:

javascript - css 类仅应用于一个元素

html - @font-face 有多新,在将它添加到网站之前我需要了解什么?

django - 在 Django 中将表单拆分为选项卡

json - 如何在 GO 中访问 JSON 的字段

javascript - 使用 window.print() 打印不同的样式表而不重新设计页面样式?

css - 使 CSS 不适用于子表

CSS:为什么将十六进制颜色转换为 hsl 然后再转换回十六进制会导致不同的值

css - 为什么我的 table 搞砸了我的页面?

javascript - TinyMCE 放在 Bootstrap 模态对话框时不能全屏

c# - PrintDocument.Print() 抛出 Win32Exception