重现色彩效果

Question

当选择引用其他单元格的Excel单元格时，将以不同的颜色系统突出显示所引用的单元格。 我想模仿并在JavaScript和CSS中重现这种效果。

例如，在开始时， Cell A1的背景颜色是gray ：

双击Cell C2 ，其引用的单元格将突出显示：

我们仅学习背景色（忽略边框色）。 现在A3是purple ; A2在purple on top of red呈purple on top of red ; A1是purple on top of red on top of blue on top of gray 。

有谁知道这种颜色效果的调用方式（例如overlay和hover ）？ 那里有opacity的概念吗？ 给定purple和red的颜色代码（可能还有opacity数字），JavaScript和CSS中是否有一种简单的方法来产生A3的颜色？

Answer 1

我唯一能想到的就是使用svg和矩形，动态生成它们并根据所选单元格的数量为它们分配颜色（我想Excel会分配随机颜色吗？！）。 您可以使用mix-blend-mode来实现叠加效果（请参见下面的代码片段，注意定义的颜色和显示的颜色）。

 .multiply { background: white; } .multiply rect { mix-blend-mode: multiply; } 

 <svg class="multiply" width="400" height="500"> <rect fill="cyan" width="150" height="20" x="0" y="0" /> <rect fill="yellow" width="100" height="40" x="50" y="0" /> <rect fill="magenta" width="50" height="60" x="100" y="0" /> </svg> 

您可以执行此操作的另一种方法（这是更多面向Javascript的方法）是计算要合并的颜色的RGB值，然后使用R，G和B值创建覆盖的颜色， 请参见链接