Question

我看到一些线程在谈论这个，但是当您在.css中使用方括号时，我看不到任何人如何更改.css

标题中有一个.css，我想让用户能够更改背景颜色和文本颜色。

在我的网站中使用检查器，我检测到了CSS的哪些部分。

彩色文本位于此.filepond--文件中：

.filepond--file {
  position: static;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  -ms-flex-align: start;
  align-items: flex-start;
  padding: 0.5625em 0.5625em;
  color: #fff;
  border-radius: 0.5em;
}

背景在这里：

[data-filepond-item-state='processing-complete'] .filepond--item-panel {
  background-color: #369763;
}

我应该如何使用javascript更改两种颜色？谢谢！

Answer 1

您不需要编辑CSS样式表。您可以在页面上添加自己的样式元素，从而可以覆盖以前的样式。

例如

var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.filepond--file { color: #F00 !important; }';
style.innerHTML = '[data-filepond-item-state='processing-complete'] .filepond--item-panel { background: green !important; }';
document.getElementsByTagName('head')[0].appendChild(style);

例如，如果将以下代码复制粘贴到StackOverflow开发人员控制台中，它将使邮政编码变成黑白色。

var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.prettyprint { color: white; background: black }';
document.getElementsByTagName('head')[0].appendChild(style);

使用javascript编辑.css（带方括号）

1 个答案: