Question

这是我试图使打印友好的页面，因此它将列出两列中的所有内容

这是每个信息块所在的div的css

#off-campus-print-friendly {
  font-family:arial;
  border:1px solid red;
  overflow:auto;
  font-size:.8em;
  line-height:1.5em;
  padding:10px;
}

#off-campus-print-friendly div {
  width:45%;
  float:left;
}

#off-campus-print-friendly p {
  margin:5px 0;
}

当我打印页面时，它只在一列中打印，而不是在页面上显示的方式。

感谢任何帮助。

Answer 1

将您的样式表链接更改为屏幕并打印

<link rel="stylesheet" type="text/css" media="screen, print" href="http://www.herkimer.edu/?css=styles/print.v.1245694939" charset="utf-8" />

通过编辑页面上的源代码（firebug）进行测试，它可以正常工作。

Answer 2

最佳做法是，您应该在原始页面上有专门用于打印的第二个css文件。这消除了对第二个易于打印的页面的需求：

<link rel="stylesheet" type="text/css" media="print" href="print.css" charset="utf-8" />

Answer 3

此外，如果你想让一个样式表适合所有媒介，你可以使用它：

<link rel="stylesheet" type="text/css" media="all" href="master.css" charset="utf-8" />

您还可以在CSS文件中使用块来隔离特定于媒体的特定样式：

@media print {
    p { font-size: 14pt; }
}
@media screen {
    p { font-size: 12pt; }
}

打印友好版本，尝试打印2列信息

3 个答案: