logo标签列表

如何使用CSS格式化HTML表格以便打印？

htmlcss
6

我想使用CSS格式化表格以显示出勤表。如何向表格添加CSS样式，以便可以打印？

2
http://www.w3schools.com/css/css_mediatypes.asp - Eugen Constantin Dinca
6个回答
4
使用以下CSS：
table, th, td
{
  border-collapse:collapse;
  border: 1px solid black;
  width:100%;
  text-align:right;
}

你还可以使用 media="print" 来针对打印特定的布局。

4

在您的样式表中，使用

@media print {
  /* put your CSS rules if they are to apply in print only */
}

例如，
@media print {
   * { color: black; background: white; }
   table { font-size: 80%; }
}

具体细节取决于您在打印特定表格时预计遇到的问题类型。一般而言，如果您已经设置了固定的列宽（例如以像素为单位），则可能需要重新考虑设计的这一部分。如果您使用颜色来传达重要信息（例如，红色单元格表示缺席，绿色表示出席），则需要重新考虑这个决定。

2
使用media="print"属性为CSS样式表设置打印特定的布局。
2
您可以使用@media规则将特定于媒体的CSS样式添加到页面中。
例如，@media screen将使用计算机屏幕的样式，@media print用于打印机。
使用@media all将确保您的样式适用于所有媒体类型设备。
请访问链接link了解更多有关媒体类型的信息。
1
您也可以使用 <\p>。
body {
-webkit-print-color-adjust:exact;
}
1

纠正所有正确的答案。

我会制作一个专门用于打印的CSS文件，并将其附加到页面上：

<link href='/css/theme-print.css' rel='stylesheet' media="print" type='text/css' />
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接