代码之家  ›  专栏  ›  技术社区  ›  Michael Coker

继承(颜色)值上的CSS自定义属性更改无效[重复]

  •  1
  • Michael Coker  · 技术社区  · 6 年前

    .bar color: var(--color); 来自它的父母。

    --color 换成另一种颜色

    有人能解释为什么,以及需要什么才能改变 --颜色

    :root {
      --color: red;
      --color2: blue;
    }
    
    .foo {
      color: var(--color);
    }
    
    .bar {
      --color: var(--color2);
    }
    <div class="foo">
      foo
      <div class="bar">
        bar
      </div>
    </div>
    1 回复  |  直到 6 年前
        1
  •  1
  •   Fabrizio Calderan    6 年前

    属性已正确重新定义,但直到您不设置 color .bar

    :root {
      --color: red;
      --color2: blue;
    }
    
    .foo {
      color: var(--color);
    }
    
    .bar {
      --color: var(--color2);
      color: var(--color);
    }
    <div class="foo">
      foo
      <div class="bar">
        bar
      </div>
    </div>