更改打印页面样式

• 下载源代码 - 21.2 Kb

问题

设想一下在Web应用程序中，我们需要使用Internet Explorer的打印选项以用户友好的格式打印报告页面。这意味着，我们主要需要在打印时更改页面的样式。我们如何实现这一点？ 在本文中，我想解释如何做到这一点。

在进入解释之前，我们可以先看一个例子…… 假设我要打印此页面

页面需要更改为这样

您注意到了Web表单的变化吗？ 这可以通过样式表的帮助来实现。

解决方案

我们将看到如何在打印期间实现这一点。为此，我们需要执行以下操作

步骤 1

首先，我们需要创建两个不同的样式表，一个用于默认视图，另一个用于打印样式。

第二步

现在，在页面标题中声明样式表，如下所示

<LINK title="MainStyles" href="styles/DefaultStyles.css" 
      type="text/css" rel="stylesheet">
<LINK title="PrintStyles" media="print" 
      href="styles/Print.css" type="text/css" rel="stylesheet">

我们需要注意的一点是，在第二个链接上，我们需要提供属性media="print"。

在这种情况下，放置两个页眉和页脚表，并为CSS类名指定.print。 在默认样式页面中，在类.print中提供display:none;，并在打印样式类中提供display:inline。 对于同一个类，我们声明了两个具有不同定义的样式表。 样式将根据页面状态自动获取正确的值。 这适用于所有控件。

在打印页面样式中，我们首先提供

#SearchDescription, #Cancel, #Buttons, 
      #SearchCriteria,.clsBtnControl{
    display: none;
}

这用于在打印选项期间禁用所有不需要的控件。 然后，我们启用在搜索选项中未显示的控件。

.Print {
    display:inline;
}

我们可以将此页眉和页脚泛化为两个单独的用户控件，以便您可以在项目中将其用作常规页眉和页脚。 我们仅在搜索期间将值设置为控件。

对于按钮，我们做同样的事情。 我的意思是，在打印选项期间将可见性设置为false，以便我们可以从IE打印选项获得用户友好的打印格式。

现在无需为打印创建单独的选项……它用户友好，您可以非常轻松地使其保持活跃状态。