How to convert rgb/hex into rgba(with opacity) color in React CSS Styled components [重复]

问题描述 投票:0回答:0

我知道有很多答案可能会解决我遇到的问题,但是,我会喜欢第二意见并可能有一个干净的解决方法。

我在 hex/rgba 中有简单的 css 颜色变量。

--complementary-contrast-alt-1: #4d4d51; (prefered format) or 
--complementary-contrast-alt-1: rgb(78, 78, 81) (alternative format);

所以这个变量应该始终采用相同的格式,因为它可以从后端替换: 但是,我需要为其添加不透明度。 在我正在实施的新变量中:

 --complementary-contrast-1-translucent:  rgba(var(--complementary-contrast-alt-1), 0.9);

遗憾的是,除非主要变量是数字,否则这不会起作用:

 --complementary-contrast-alt-1: 78, 78, 78;

粗略的这个提出了更多问题,因为主变量适用于我的新变量,但它不适用于其他所有也在使用它的变量。

我正在寻找一个不包含 JS 函数的解决方案。某种解决方法可以简化结果。或者如果没有功能就没有办法让它看起来像什么?.

javascript css reactjs styled-components
© www.soinside.com 2019 - 2024. All rights reserved.