灰色字体彩色印刷

是否有办法确保我的灰色字体颜色不会变成黑色?

Firefox和Chrome这样做似乎是为了防止黑色背景上的白色文本变成白色背景上的白色。我没有背景色(除了白色)，所以这个浏览器级别的转换是没有用的，它只是帮助防止灰色无缘无故。

有办法关闭这个吗?或者我应该坚持使用不透明度、浏览器检测和灰色着色等技术……

解决方案:

  @media print {
      h1 {
        color: rgba(0, 0, 0, 0);
        text-shadow: 0 0 0 #ccc;
      }
      @media print and (-webkit-min-device-pixel-ratio:0) {
        h1 {
          color: #ccc;
          -webkit-print-color-adjust: exact;
        }
      }
   }

我发现不得不:

添加!important到css规则…,
在Firefox打印对话框中，勾选"外观:打印背景色"

我无法让它在Chrome中工作

我以为那是那个页面上唯一的div。做以下更改，它应该可以正常工作。

<style>
@media print {
div.red {
      color: #cccccc !important;
  }
</style>

并更改div标签的html如下

一些浏览器添加更多的尊重你的灰色，如果你添加颜色:用#778代替#777。警惕不透明。有时，即使打印预览将显示很好的结果，它实际上只在选定的打印机上工作。如果你的文本是灰色的，不透明的，带有不幸固件的打印机将无法打印。

您只需要在svg中输出您的灰色字体。浏览器不会在svg中改变颜色。下面是一个例子:

<svg height="40" width="200">
   <text font-size="28px" y="25" x="30" fill="#ffffff" >
   Some text
   </text>
</svg>

我发现TEXT颜色不是由"通用"样式表继承的，但必须在打印css文件中再次强制。

换句话说，即使在通用css文件(具有media='all'属性的文件)中设置了文本颜色，在打印时也会忽略它，至少在Firefox和Chrome中是这样。

我发现再次写作(冗余但.....在打印css文件(一个有media='print'属性)的文本颜色，颜色现在将被考虑。

此解决方案适用于所有浏览器:

.text{ color: transparent; text-shadow: 2px 0 #red; }

重视颜色:

.bgcol{
background-color:skyblue !important;
}
 .subject_content,h2,p{
 color:rgba(255, 255, 255) !important;
    margin: 25px auto;
}
<body class="bgcol">
       <div class="subject_content">
      <h2 class='text-center'>fhddfhnt area</h2>
      <p>sdgdfghdfhdfh.</p>
     </div>

以上都不适合我，所以我终于弄明白了。

总是给直接元素赋予颜色。例如:假设你的html是

<div class='div'><br/>
      < h1>Text< /h1><br/>
</div>

和CSS

.div { 
     color: #ccc; 
    }

这是我的案子。在这种情况下，无论你怎么做，颜色都不会显示。

你必须做

.div h1 { 
 color: #ccc; 
}
@media print { 
 .div h1 { 
    -webkit-print-color-adjust: exact; 
   } 
}

希望这对你有帮助!!

请回复，如果你找到一个更好的解决方案，因为这是我能找到的2小时后，它适用于我。

相关内容

最新更新

热门标签：