如何让 IE7 打印此
请注意,这似乎只是 Internet Explorer 7 及更低版本中的问题。这是我的 HTML 的简化版本:
<table>
<colgroup>
<col width="20" class="hidden_col" />
<col width="50" />
<col />
</colgroup>
<tr>
<td class="hidden_col"><input type="checkbox" /></td>
<td>Title</td>
<td>Longer Description</td>
</tr>
</table>
然后,我包括一个“打印”样式表,如下所示:
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
该样式表包括以下内容:
.hidden_col {
display: none;
}
现在在几乎所有其他浏览器上,甚至包括 IE8,这都可以正常工作。在屏幕上您可以看到第一列,但在打印预览中则看不到。但由于某种原因,IE7 的行为非常奇怪。当然,它会在屏幕上正常显示内容,但是当您在 IE7 中进行打印预览时,唯一显示的内容是“更长的描述”。换句话说,它隐藏了第一列,也隐藏了第二列。如何使其在所有浏览器中都有效?
Note that this only seems to be an issue in Internet Explorer versions 7 and lower. Here's a dumbed-down version of my HTML:
<table>
<colgroup>
<col width="20" class="hidden_col" />
<col width="50" />
<col />
</colgroup>
<tr>
<td class="hidden_col"><input type="checkbox" /></td>
<td>Title</td>
<td>Longer Description</td>
</tr>
</table>
Then, I'm including a "print" stylesheet, like this:
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
And that stylesheet includes the following:
.hidden_col {
display: none;
}
Now on just about every other browser, even including IE8, this works fine. On the screen you see that first column, in print preview you don't. But for some reason, IE7 behaves very oddly. It displays things normally on the screen of course, but when you go to print preview in IE7, the only thing that shows is "Longer Description." So in other words, it hides that first column, and it also hides the second column. How do I make this work in all browsers?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
你不能隐藏表格的单个元素,表格内的元素只能使用以“table-”开头的CSS显示属性,至少它们应该如此。有关详细信息,请参阅此。
编辑:我认为您的问题只是使用您不应该使用的属性造成的故障。
You cannot hide a single element of a table, elements inside a table can only use the CSS display properties that start with 'table-', at least they're only supposed to. See this for more information.
Edit: I'd assume your problem is just a glitch from using properties you're not supposed to be using.
试试这个:(未经测试)
由于某种原因,在打印模式下,某些浏览器上的打印模式下可能会延续 CSS 样式。
Try this: (untested)
for some reason in Print mode there can be a continuation with CSS styles in print mode on some browser.
我最终所做的只是简单地指定单元格本身的宽度,而不再使用
。在我看来并不理想,所以我将暂时保留这个问题,以防任何人都能提出更好的解决方案,但它确实有效。这是我最终的 HTML:
What I ended up doing is simply specifying the widths on the cells themselves and not using the
<colgroup>
anymore at all. Not ideal in my mind, so I'll leave this question open for awhile in case anyone can come up with a better solution, but it did work. Here was my final HTML: