Css 打印样式表问题

Css 打印样式表问题,css,printing,webforms,stylesheet,media-queries,Css,Printing,Webforms,Stylesheet,Media Queries,我想做的事我认为是不可能的,但我还是要问=> 首先,我不会在打印时显示图像,因为我的页面可能会变得图像沉重,或者至少有两张尺寸合适的图像会消耗墨水。因此,是否可以不显示图像而显示图像的ALT文本,以便用户知道图像是什么 第二,当用户打印表单时,由于表单的样式不同,它有点难看。是否有一种方法可以将输入更改为仅显示输入的文本而不显示其他内容 有一个与此类似的问题~~我知道这可以使用jQuery来完成,但是否有一种仅使用CSS的方法来实现这一点 谢谢 编辑-我想出了我的第二个问题。我将表单边框和背景设

我想做的事我认为是不可能的,但我还是要问=>

首先,我不会在打印时显示图像,因为我的页面可能会变得图像沉重,或者至少有两张尺寸合适的图像会消耗墨水。因此,是否可以不显示图像而显示图像的ALT文本,以便用户知道图像是什么

第二,当用户打印表单时,由于表单的样式不同,它有点难看。是否有一种方法可以将输入更改为仅显示输入的文本而不显示其他内容

有一个与此类似的问题~~我知道这可以使用jQuery来完成,但是否有一种仅使用CSS的方法来实现这一点

谢谢


编辑-我想出了我的第二个问题。我将表单边框和背景设置为白色以匹配页面。换句话说,它只隐藏和显示文本。=>

是的,有。它被称为@media,在主流浏览器中已经支持了一段时间

那么,让我们假设你有这样的东西:

<img class="no-print" src="image" /><span class="print">Image Label</span>
<stye>
   .print {display: none;} // only to be displayed when this is being printed so the default is to not display
   @media print {
      .print {display: inline}
      .no-print {display: none}
   }
</style>
图像标签
您的样式表可能类似于:

<img class="no-print" src="image" /><span class="print">Image Label</span>
<stye>
   .print {display: none;} // only to be displayed when this is being printed so the default is to not display
   @media print {
      .print {display: inline}
      .no-print {display: none}
   }
</style>

.print{display:none;}//仅在打印时显示,因此默认为不显示
@媒体印刷品{
.print{display:inline}
.no打印{显示:无}
}

谢谢。一个简单的解决方案。现在来看第二部分=>