Css 在白色背景上计算不透明度为50%时的RGB值，以匹配不透明度为100%时的RGB值

我在博客中嵌入了一些Facebook帖子。我为我的

iframe

做了一个很好的包装，使用了与Facebook相同的背景颜色：

rgb（240242，245）

现在，我想将

iframe

嵌入到具有自己背景颜色的

div

中：

\f2f0fc

。浅紫色上的灰色很刺耳。我不想使用Facebook的灰色，而是想将我的

div

调暗，就像Facebook的灰色调暗

白色一样

起初，我以为我可以将Facebook的每一个颜色组件切成两半，然后应用
0.5
不透明度，但这显然是不对的

编辑：我的第二个想法是，因为我要将三个组件切成两半，它实际上是一个立方运算，因此我必须将不透明度设置为
0.5^3=0.125
。这离我们很近，但还是有点远


.grid{
显示：网格；
网格模板柱：1fr 1fr 1fr；
网格间距：1rem；
}
.facebook包装器{
显示器：flex；
背景色：rgb（240、242、245）；
填充：1rem；
}
.facebook-wrapper.transparent{
背景色：rgba（120,121,122,0.5）；
}
.facebook-wrapper.transparent-2{
背景色：rgba（120、121、122、0.125）；
}
.facebook wrapper>.post{
最大宽度：680px；
宽度：100%！重要；
左边距：自动；
右边距：自动；
背景色：白色；
填充：0.5雷姆1雷姆；
}
怀特先生{
填充：1rem0；
背景色：白色；
边框：1px纯色灰色；
}
.警惕{
背景色：#f2f0fc；
填充：1rem0；
}

不透明50%透明12.5%透明
Facebook帖子！
Facebook帖子！
Facebook帖子！
Facebook帖子！
Facebook帖子！
Facebook帖子！
根据Termani的评论，给出了以下公式：

ColorF=（ColorT*opacityT+ColorB*OpacityB*（1-opacityT））/factor

颜色F是我们的最终颜色ColorT/ColorB分别是顶色和底色不透明度Y/不透明度B分别是为每种颜色定义的顶部和底部不透明度：

系数
由以下公式定义
OpacityT+OpacityB*（1-OpacityT）

OpacityB
在本例中为
1
，
ColorB
为
rgb（255，255，255）

将所需值插入方程，我们得到：

rgb（240242，245）=（ColorT*0.5+rgb（255，255）*1*（1-0.5））/（0.5+1*（1-0.5））
rgb（240，242，245）=（色度*0.5+rgb（255，255，255）*0.5）/1
rgb（240，242，245）=色度*0.5+rgb（255，255，255）*0.5
rgb（240，242，245）/0.5=ColorT+rgb（255，255，255）
2*rgb（240、242、245）-rgb（255、255、255）=彩色
rgb（480-255484-255490-255）=彩色
rgb（225229235）=彩色


.grid{
显示：网格；
网格模板柱：1fr 1fr；
网格间距：1rem；
}
.facebook包装器{
显示器：flex；
背景色：rgb（240、242、245）；
填充：1rem；
}
.facebook-wrapper.transparent{
背景色：rgba（225229235,0.5）；
}
.facebook wrapper>.post{
最大宽度：680px；
宽度：100%！重要；
左边距：自动；
右边距：自动；
背景色：白色；
填充：0.5雷姆1雷姆；
}
怀特先生{
填充：1rem0；
背景色：白色；
边框：1px纯色灰色；
}
.警惕{
背景色：#f2f0fc；
填充：1rem0；
}

不透明50%透明调整
Facebook帖子！
Facebook帖子！
Facebook帖子！
Facebook帖子！
我想是#7676。您可以随时截屏并使用图形程序进行双重检查。我的彩色背景不一定是静态值，这就是为什么我需要透明度来工作。不清楚您想要实现什么。代码片段中的预期结果是什么？左还是右？目标是找到RGB值或不透明度值，以便它们的组合匹配左上框，这可以应用于底部的背景色。我有一个透明层-->这是多个透明层和一个不透明层的一种特殊情况，因此如果您全面阅读答案并理解其背后的数学知识，这将非常有用