图像在打印预览中调整大小

Question

我的网页上有几张图像（不是背景图像），当我以 100% 比例看到打印预览时，图像看起来不错，但我的问题是，当我使用“缩小以适应比例”进行打印预览时，所有图像都会出现小于实际尺寸。我没有在 IMG 标签上提供任何宽度或高度属性，因此我假设在打印预览中它将按照屏幕上显示的方式加载。我已将下面的 css 用于 IMG 的打印媒体，但它不起作用

img {max-width:100%; }

我期望在“Shrink”中具有相同的图像尺寸以适合并且 100% 缩放。

这可能吗？我在 print css 中遗漏了一些东西吗？请指教。

Answer 1

在处理我的项目时，当我需要在打印预览中获取图像的原始大小时，我必须使用!important.否则，它不会覆盖最初为页面上的图像定义的样式。

我还必须修改图像容器的高度：

@media print {
      .logo-container,
      .img-wrapper,
      img {
        max-height: none !important;
        height: 100% !important;
}