Javascript 将变量作为标题传递给css

我看到您可以在css中创建“变量”：

我的文件：

(style.css file)

[title~=--myVariable] {
    color: red
}

---

您可以使用css var（）设置回退

但请注意：

var（）函数不能用于属性名称、选择器或除属性值以外的任何其他内容

更新：我看到你被编辑了，所以上面的报价将不起作用

要回答这一部分：

是否可以这样做，如果我的标题有标题，则颜色为红色，否则保持为Is（黑色）

（style.css文件）

.App h1{
颜色：黑色；
}
瑞德先生{
颜色：红色；
}

（App.js文件）

。。。
函数App（{headerTitle}）{
返回(
一些红色的文本？
)
}

我在您的代码中没有看到任何css自定义属性（css变量的另一个名称），恐怕这是不可能的。CSS变量仅与CSS一起使用，不能从JS代码中注入。查看动态样式解决方案，如或。它们允许使用JS在代码中创建样式。我最终将不得不使用它们，但如果无法使用upper，那么它将无法工作。。。（因为我会将它们传递给react，但仍然->现在标题检查字符串“myVariable”，我希望变量的值在那里…我更新了question@Fyodor问题是我正在使用外部组件（库？）在react中，在某些元素中没有样式的实现，因此我尝试如上所示添加它。因此，不幸的是，您的解决方案对我没有帮助。问题是我的标题是动态创建的。我不知道它将是什么。

(App.js file)
...
return (
    <div className="App">
      <h1 title="thisIsTheTitle"> Some text in red color ? </h1>
    </div>
  )

(style.css file)

:root {
  --myVariable: white;
}