WordPress 中 Divi 主题生成器的问题

Question

向大家问好。

我正在尝试使用名为 Divi Builder 的 Wordpress 工具将我的 CSS 代码放在表单上。但我输入的代码与我编写的代码完全不同。我已经尝试了几乎所有的方法，但没有任何效果。如果你们能提供帮助，我将把我的 CSS 代码放在这里，我将非常感激。

我制作的 CSS 代码：

._form-content {
  display: flex;
  flex-direction: row;
  gap: 7px;
}
input {
  display: flex;
  width: 252px;
  height: 34px;
  border-radius: 8px;
  fill: #f9f9f9;
  border: 1px solid #b0b0b0;
}
input:focus {
  outline-color: #821313;
}
button {
  width: 286px;
  height: 34px;
  border-radius: 10px;
  background-color: #821313;
  color: #fff;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  font-weight: 600;
  transition: all 0.3 ease;
}
button:hover {
  background-color: #5c0d0d;
}

这才是应该的

这就是它的样子

这是我遇到的一些错误

再说一次，任何帮助我都会非常感激。

我尝试重写整个CSS代码，尝试使用标签放入HTML代码中。

Answer 1

Divi 有大量内部 CSS 规则，其中大多数都有非常具体的选择器，由许多组合/嵌套类/ID/标签组成，甚至通常包含 !important这使得覆盖它们变得更加困难。您的 css 规则很可能会被如此复杂的 Divi 规则覆盖。

您必须在元素上使用浏览器工具来查看哪些 divi 规则适用于它们，然后使用具有更高特异性的选择器创建规则（如果您不知道我在说什么，请谷歌“css 特异性”） ）。如果这些 divi 规则包含 !important，您别无选择，只能在规则中使用 !important 来覆盖 divi 规则。