javascript - 在网站 Bootstrap 上更改容器的背景颜色

Question

我通过 orchard 负责一个模板网站，但无法访问 CSS。所有这些都是新手，如果非常简单，请原谅我。

该站点有许多由模板固定的容器，所有容器的背景都是白色的。

如何只覆盖一个访问受限的容器的背景颜色，同时让其他容器保持白色？

我可以选择使用 Javascript 和 HTML 来覆盖 CSS。

Answer 1

可以通过三种方式为标签添加样式:

1-内联样式

这意味着您可以在每个想要的标签上插入样式。例如:

<h1 style="color:blue;">This is a Blue Heading</h1>

2-Javascript

您可以使用 javascript 选择器并更改您想要的每个标签的样式。例如:

document.getElementById("test").style.color = "red";

<h1 id="test">This is a Blue Heading</h1>

3-内部样式

您可以插入 <style></style>在你的 head 中标记并在那里定义您的规则。

---

对于您所说的这种情况，您必须使用第二个选项。也为您的样式使用重要。

var x = document.querySelectorAll(".zone");
x[0].setAttribute('style', 'background-color: red !important');

<div class="fsi-main-wrapper">
  
  it is a test

  <div id="layout-before-main" class="group fsi-before-main fsi-before-main-home ">
    
    it is another test
  
    <div id="layout-before-main-inner" class="fsi-layout-before-main-inner fsi-layout-before-main-inner-home">
    
      and also this is a test
    
      <div class="zone zone-before-main">

        something here ...

      </div>
    </div>
  </div>
</div>