1

我的网站在 asp.net 4 / vb 中。我试图找出最好的方法来制作一个对打印友好的页面，该页面仅在顶部包含我们的徽标和相关信息，但省略了导航栏和其他不必要的内容。我有一个点击打印图标，它在所有浏览器中都能正常工作，但它并不总是打印出适合打印机的。

我已经在这个网站上阅读了有关制作 print.css 样式表的内容，但我不确定如何编写样式表，或者是否必须将 div 属性分配给我想要省略的内容——这些帖子是以前的帖子。是否建议我省略导航链接等，如果是，最好的方法是什么？谢谢您的帮助！

4

2 回答 2

2

You can use CSS @media types.

<p> this should be part of the printed page </p>

<div id="navigation_bar_that_should_not_be printed" class="noprint">.....</div>

A simplistic style sheet for the above would be:

@media screen
{
   /* whatever styles you have for display */
}

@media print
{
   .noprint { display: none; }
}

In the above, the <div> with the class="noprint" will be displayed on screen as usual, but it will not be printed.

Update:

The "C" in CSS stands for "cascading" - meaning the "last" or closest instruction wins. I can only assume that the <span class="bodycontent"... (being the last or closest) is overriding the div.

ASP.Net Controls have a CssClass property, that's how you'd define it:

<asp:HyperLink NavigateUrl="http://www.google.com" runat="server" CssClass="noprint" Text="foo" />

You can even directly type class="noprint" (instead of using CssClass) in any ASP.Net tag - VS may complain but it should be ok:

<asp:HyperLink NavigateUrl="http://www.google.com" runat="server" class="noprint" Text="foo" />
于 2012-09-23T03:07:56.670 回答
1

您不需要实际添加其他元素来包装您不想在打印时显示的内容。print_hide打印样式表的最佳方法是在打印页面时对要隐藏的元素应用一个类（可能称为它）。例如：

<div>Text</div>
<img class='print_hide' src='some_huge_image.png'/>

在您的 print.css 样式表中，您可以：

.print_hide {
    display: none;
}

要应用样式表，请将其添加到您的head：

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

仍然会div打印，但图像不会。

当然，这是除了您想要的任何其他样式更改之外的，例如删除背景图像、更改颜色、字体等。

将该类添加到要在打印时隐藏的东西是对现有代码的相对最小的更改。

另一种选择是为您的所有页面创建一个单独的打印机友好版本，如果您的页面非常复杂，这可能就是这样做的方法。话虽如此， print.css 的好处（除了工作量减少之外）当然是用户不需要显式选择 select Printer friendly version。

于 2012-09-23T02:12:49.877 回答