首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
GeekHub
MajestySolor
V2EX  ›  程序员

CSS 里颜色变量使用透明值的问题

  •  
  •   MajestySolor · 17 天前 · 562 次点击
    :root {
      --color-main: rgb(236, 65, 65);
    }
    
    .text {
      color: var(--color-main);
    }
    

    这是最基本的变量使用,但是这里有个问题,那就是如果我想使用不同的透明度就必须定义同一个颜色不同透明度的变量,非常不方便,然后在 stackoverflow 上看到了另一种更灵活的写法

    :root {
      --color-main: 236, 65, 65;
    }
    
    .text {
      color: rgba(var(--color-main), 0.8);
    }
    

    看上去很完美,然而在我实际使用中发现 --color-main: 236, 65, 65 这样的写法在编辑器里是无法显示颜色拾取器的,比如我用的 VSCode 就不行

    想问问各位大佬有么有更方便更灵活的办法

    2 条回复    2020-03-23 23:27:30 +08:00
    VDimos
        1
    VDimos   17 天前 via Android
    这个特性还没用过,感觉用了 less 回不去了
    noe132
        2
    noe132   16 天前
    明显 css variable 是 runtime 才能确定的值。而且遵循层叠规则,更高优先级的覆盖低优先级。
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   3032 人在线   最高记录 5168   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 14:35 · PVG 22:35 · LAX 07:35 · JFK 10:35
    ♥ Do have faith in what you're doing.