在css變量中設置rgba上的不透明度/ alpha

Question

我嘗試了CSS變量，我想使用RGB顏色。

這裏是我的CSS的變量：

color: var(--primary) 

但有些段落也使用這種原色，我想給他們：

--primary: rgb(112, 199, 255); 

因此，使用下面的代碼時，這工作絕對沒問題略微透明。現在，我可以更換，然後再創建CSS變量，像這樣：

--primary: rgb(112, 199, 255);  
--primary-alpha: rgba(112, 199, 255, 0.7); 

但這只是感覺混亂和困惑有兩種原色和什麼如果我使用了幾個不同的透明度。我還可以使用下面的CSS變量：

--primary: 112, 199, 255; 
--alpha: 0.7; 

和輸出使用下面的代碼是：

color: rgba(var(--white), var(--alpha)); 

這個工程，我想，我個人認爲是這樣做，但我的顏色的更好的方式不要在我的代碼編輯器中預覽圖片。

看那--dark變量，它不會顯示使用此代碼的顏色。

理想情況下，我想用：

--primary: rgb(112, 199, 255); 

和輸出它像這樣：

color: var(--white), var(--alpha); 

但它不會工作？

Answer 1

假設您正在使用atom-pigment。顏色檢測也在評論中起作用。所以你也許可以在註釋中添加實際的rgb值，僅供參考&照常使用該變量。像這樣：

--dark: 18, 38, 51 /* this color is - rgb(18, 38, 51) */