Question

我有一个div属性：

background-color: #327EB2;

当我在浏览器上打开页面时，我注意到显示了不同的颜色。如果我捕获屏幕并在Photoshop上打开捕获的图像，我可以看到捕获的颜色代码实际上是＃437BB6。我的CSS样式表中没有任何颜色设置。

我已经在不同的显示器，不同的颜色分辨率，不同的浏览器和版本上测试过FF 4+到IE8 +，Opera，Chrome，Safari等......

实际上我认为这不是显示器，分辨率或浏览器版本的问题，因为问题在于所显示颜色的代码实际上是完全不同的代码！

另外，Photoshop警告我＃327EB2这不是“Web安全颜色”，但我不认为这是问题，因为我经常在我的工作表中使用非网页安全颜色，我从来没有遇到过问题那样的。

**小提琴：http://jsfiddle.net/286tE/

* UPDATE

问题是div有背景图像和背景颜色。背景颜色必须匹配背景图像的最后一个像素的颜色（像往常一样），即＃327EB2。无论如何，我可以看到从图像的最后一个像素到背景颜色的不同颜色：

http://test.testblueday.eu/test/cbsissue.png

您可以在此处看到该页面，问题显示在左侧的“Top Marchi”列表之后：

http://test.testblueday.eu/test/cbstest.html

我离开了纯CSS和JS（未压缩），让你看到所有的属性。

**更新2

我使用Mac，但我们也可以在Windows上看到问题。

Answer 1

你的问题与CSS无关，问题出在图片中！

这是因为您提供的示例在额外的背景上显示正确的＃327EB2（通过CSS“着色”），这足以知道CSS部分正常。

注意通过Photoshop导出的文件中进行的颜色校正/管理。

如果无法对颜色进行颜色管理/恢复，则另一种解决方法是反之，更改CSS颜色以匹配图像的最后一行。

Answer 2

据我所知，一切正常。底部的图像颜色为代码“＃1080b3” - 我刚刚下载了该图片（gradient_box_emboss.jpg）并在GIMP中使用了colorpicker的颜色。当我像这样修改css时：

.embosser {
   background: #1080B3 url('/images/gradient_box_emboss.jpg') right top no-repeat;
   color: white;
   padding: 5px 6px;
}

缺少差异。当我打印您的网站并将其粘贴到GIMP中时，颜色选择器会显示“错误”背景的颜色为#327eb2。当我打开您的图像时，您的问题是背景颜色为#307db7。它是jpg，我想在将原始数据压缩为.jpg时丢失了一些颜色信息。可能的是，当你试图在photoshop中获得颜色时会发生类似的事情。

将图像从一种格式转换为另一种格式时，可能会出现问题。上面最简单的修复 - 将背景颜色更改为图像上的颜色。

CSS：浏览器显示的颜色代码与CSS样式表上设置的颜色代码不同

2 个答案: