打印时 Div 文本颜色发生变化
Posted
技术标签:
【中文标题】打印时 Div 文本颜色发生变化【英文标题】:Div Text's Color Changes when Printed 【发布时间】:2015-09-08 17:58:28 【问题描述】:我有一个带有白色文本颜色的 div。
使用 css 媒体查询。
@media print
.myid_print_duo_name
z-index: 2;
position: absolute;
left: 0px;
top: 330px;
width: 303px;
height: 28px;
line-height: 28px;
text-align: center;
color: white !important;
font-weight: bold;
font-size: 20px;
font-family: "Times New Roman";
在我的打印预览中,我的文字看起来有点暗。
我认为这还不错,但打印结果在我的打印预览中确实是一样的。为什么颜色变暗了一点?
【问题讨论】:
所有屏幕尺寸都使用相同的颜色吗? 尝试用十六进制编码颜色:#ffffff !important; 【参考方案1】:MDN Docs:添加以下规则将覆盖用户的打印机属性设置。
@media print
.myid_print_duo_name /* Replace class_name with * to target all elements */
-webkit-print-color-adjust: exact;
color-adjust: exact; /* Non-Webkit Browsers */
【讨论】:
当。就是这样。 Firefox 覆盖了打印默认值。【参考方案2】:试试这个 css,它可能对你有帮助。
@media print
.myid_print_duo_name -webkit-print-color-adjust: exact; color:#fff !important;
【讨论】:
【参考方案3】:某些浏览器有一个名为print-color-adjust
的属性,它可能会使某些颜色变暗而使另一些颜色变亮。尝试在你的 CSS 中添加这些:
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
取自 Smashing 的网站:http://www.smashingmagazine.com/2013/03/08/tips-and-tricks-for-print-style-sheets/
【讨论】:
以上是关于打印时 Div 文本颜色发生变化的主要内容,如果未能解决你的问题,请参考以下文章
Matlab中的Geoshow - 打印到tiff文件时面部颜色发生变化
jQuery:悬停链接时在div中动画(淡化)背景颜色或图像?
jquery效果,多个div,点击任何一个div,那么这个div会切换文字,变换背景颜色,再次点击其他的div ,这个div会发生刚才的变化,之前点击的div的颜色会变回来