Question

我有一个asp.net mvc应用程序，我的视图是HTML5。我需要打印一个视图作为报告。此视图显示了一些带有<table/>标记的数据，其格式为css样式为font-family，font-size，text-align属性等。当我尝试使用Chrome打印时（导出）到PDF）我的css不起作用，我的意思是，打印的结果显示没有格式化。

我该怎么做才能解决这个问题？无论我是使用css来应用样式还是使用html标签来格式化页面，但我希望它会留下格式化的印象。

PS：我想保留html有效文件。

Answer 1

您只需按照设置

分割屏幕的css并单独打印

<link href="css/main.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/print.css" media="print" rel="stylesheet" type="text/css" />

然后无需更改您的HTML代码只需更改css或复制旧的CSS。

Answer 2

您可以尝试使用@media print规则定义css语义，然后考虑到样式表的样式表。也许这有帮助。

Answer 3

您可以在样式表中为屏幕和打印介质使用不同的样式，即

@media screen
{
    table.test {
        font-family:"Times New Roman",Georgia;
        font-size:10px;
        // more
    }
}

@media print
{
    table.test {
        font-family:Verdana, Arial;
        font-size:10px;
        // more
    }
}

当您打印表格时，只会应用在打印介质中定义的样式。

Check this for more

打印用CSS格式化的Html文档

3 个答案: