<blockquote>
最近逛论坛，看到一个<a href="https://www.v2ex.com/t/653679#reply73">帖子</a>，里面有一个回复很有意思：
举一个刁钻的例子
背景：
CSS 也算是 GUI 开发里应用最广泛的“语言”，讲到 GUI 就可以深入到计算机图形学，取 CSS 里最常见的颜色部分
问题：
两层元素 底层 (c1=rgb) 上层 (c2=rgba) 叠加之后，呈现为什么颜色？
</blockquote>
自己<a href="https://codepen.io/alfxjx/pen/KKpevpQ">试验</a>了一下，查了一下相关的<a href="https://www.cnblogs.com/xiyanhuakai/p/20200102_1625.html">笔记</a>，还有关于图形学的<a href="https://www.jianshu.com/p/6d9a3f39bb53">知识</a>
总结：
<ol>
<li>只有底色为不透明（rgb 或者 rgba 的透明度为 1）、覆盖层半透明时，会有颜色变化</li>
<li>都是不透明，不会出现色彩叠加的问题</li>
<li>都是透明也不会（这就有点难理解...</li>
</ol>
叠加的方法和上面的<a href="https://www.cnblogs.com/xiyanhuakai/p/20200102_1625.html">笔记</a>里面说的差不多：
<ol>
<li>底色的 rgb 记为<code>r1,g1,b1</code></li>
<li>覆盖色 rgba 记为<code>r2,g2,b2,alpha</code></li>
<li>则覆盖处计算得到的最终显示 rgba 可以表示为：</li>
</ol>
<pre><code>background-color: rgba(
	r1 * (1-alpha) + r2 * alpha,
	g1 * (1-alpha) + g2 * alpha,
	b1 * (1-alpha) + b2 * alpha,
	1
);
</code></pre>
~~浅薄的研究了一下，希望可以和我讨论~~

CSS 的 RGB 颜色覆盖