css - SVG 笔画无法与 CSS 变量一起正常工作

Question

我正在尝试根据配色方案为我的 SVG 徽标设置不同的笔触颜色，但它不想正确更改，因为它总是保持白色......

@media (prefers-color-scheme: white) {
    :root {
        --color: #000;
    }
}

@media (prefers-color-scheme: dark) {
    :root {
        --color: #fff;
    }
}

#logo path {
    stroke: var(--color);
}

问题是如果我将笔触颜色更改为任何颜色，例如笔触：红色，它会保持红色......

标签： csssvgmedia-queries

Answer 1

你应该使用：

prefers-color-scheme: light

反而：

prefers-color-scheme: white