如何分组CSS颜色
假设我有一个td ，就像这样：
<td class="nice-text">Cell Text</td>
我想确保我的文本是可见的，无论td的背景是什么。 如果我们假设背景颜色存储在data-background ，如下所示：
<td class="nice-text" data-background="#000000"></td>
我们将下面的规则添加到我们的CSS中：
.nice-text[data-background=#000000] {
color: white;
}
那么如果选择#000000 ， color将变为white 。 但#000000附近有很多颜色。 既然是显然不可行写一个CSS规则为所有这些颜色和Javascript将只能在绝望的情况下，这里使用的，是有办法使用一个选择器，它定义一组的可能性color S的接近黑色，并设置color: white; 为他们？
是否有可能使用选择器来定义一组接近黑色的颜色
不，选择者对任何颜色都没有任何知识。
您将不得不编写自己的算法，以根据背景颜色确定前景色是浅色还是黑色。 如果你想完成任务，那就意味着JavaScript。 如果您试图为了实验而开发一个仅用于CSS的概念验证，那么您可以尝试模拟正则表达式（假设它们是，您似乎确信可以使用选择器来实现）并查看是否最终结果与实际的颜色匹配算法相似，并产生准确一致的结果。 如果您确实想出了一种实际可行的解决方案，而不需要通过将属性值更改为使其像编写非算法选择器一样简单的方法进行欺骗，就可以随时在案例研究中发布答案。
我的观点是，选择器不提供专为您的特定用例设计的功能，无论什么时候可能用于开发本质上是黑客的东西，可能都会花在实际的实用解决方案上。
我倾向于不相信没有备份信息的评论。
看，我可以把你和规范联系起来，但是我不能把你和任何特定的章节联系起来，因为规范没有提到任何地方的这种功能，因为工作组的唯一原因从来没有考虑过首先考虑这样的功能。 你是否想要接受这个事实取决于你。 我既不是规范的作者，也不是从事布局引擎的人员，也不是工作组中的任何其他人员都有义务向您或任何其他人证明是否存在不存在的特性可用于规范，实施，测试，和船。
当然，如果你想变得很迂腐，从技术上讲，没有什么能阻止工作组提出一个函数伪类，它将一个代表颜色的字符串作为参数，并根据列出的标准匹配元素以上。 事实上，你可以自己实现选择器（或者采取现成的非标准实现，如Sizzle），并且如果你倾向于实现这样的特性。 但是如果你真的想从专家那里得到一个明智的意见，那么这种功能对于广泛的观众是非常有用的，以保证浏览器厂商或者工作组的所有开发时间和精力。
这是可能的，但不是纯粹的CSS。 如果你可以引入一些JavaScript，这个解决方案可能适合你。 这并不完美，但它非常好。 基本上，这个函数将评估你传递它的十六进制颜色，并根据十六进制简单地返回“黑色”或“白色”。
在JavaScript中：
function getContrastYIQ(hexcolor){
var r = parseInt(hexcolor.substr(0,2),16);
var g = parseInt(hexcolor.substr(2,2),16);
var b = parseInt(hexcolor.substr(4,2),16);
var yiq = ((r*299)+(g*587)+(b*114))/1000;
return (yiq >= 128) ? 'black' : 'white';
}
我在这里有一个工作示例https://jsfiddle.net/nzcyjhz3/2/
链接地址: http://www.djcxy.com/p/87041.html