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 規則。