我有一个问题让我有些头疼。我正在尝试打印一份报告并使用 print.css 正确格式化它,但它每次都完全忽略我的 css。以前有人遇到过这个问题吗?我确保 CSS 文件位于正确的目录中,等等,但仍然没有成功。
这是我的模板:
注意:我使用 javascript 来控制打印按钮,并且在 javascript 中包含了 CSS 链接。我也曾尝试将其仅放在 HTML 页面上,但这没有帮助。
...
<script type="text/javascript">
function printContent(id){
str=document.getElementById(id).innerHTML
newwin=window.open('','printwin','left=100,top=100,'+
'width=900,height=400, scrollbars=1')
newwin.document.write('<HTML>\n<HEAD>\n')
newwin.document.write('<TITLE>Print Page</TITLE>\n')
newwin.document.write('<link rel="stylesheet" type="text/css" '+
'href="/media/css/print.css" media="print"/>\n')
newwin.document.write('<script>\n')
...
现在对于这个元素,我使用的是 Ubuntu 10.10 和 Firefox 7。如果这有帮助的话。
编辑
我为 Firefox 安装了 Web 开发人员工具栏。它允许您将页面视为不同的媒体。现在,当我点击打印时,它会显示我所有的样式更改,但当我打印时,它不会跟随它们。
最佳答案
<html>
<head>
<title>your website title</title>
<link rel="stylesheet" media="screen" href="/media/css/mainStyle.css" type="text/css">
<link rel="stylesheet" media="print" href="/media/css/print.css" type="text/css">
</head>
<body>
<input type="button" value="Print" onClick="javascript:window.print();" />
</body>
</html>
也许您可能想试试上面的 HTML 模板,看看它是否适合您或适合您的需要。
在我看来,您建议的功能实际上最好在服务器端而不是客户端使用 javascript 编写,因为您正试图在其中动态生成 html 页面。您可以将该页面输出为 print.html 或其他内容,一旦它被发送到客户端,您就可以应用 print.css 样式并进行打印。无论如何,这里只是一些想法,希望它对您的情况有所帮助。干杯。
关于javascript - 打印/预览忽略我的 Print.css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7612794/