使用 css 在站點范圍內縮進段落后，如何從該規則中排除居中文本？

Question

我使用 css 將 wordpress 中的每個段落縮進 30px。 這一切都很好，直到我注意到它還將居中對齊的文本縮進了 30 像素。 這使得這個居中的文本不居中。 當我在移動設備上查看它時，它更加引人注目，我希望文本在旅途中易於閱讀且專業。 所以，我想排除“text-align:center;” 從每個居中對齊的文本的 30px 縮進開始。

我無法使用我的 wordpress 高級帳戶訪問我的主題的整個代碼。 我只能在菜單選項中使用空白 css 編輯器來編輯 css。 如果無法看到整個代碼，這可能嗎？

在發布和使用此代碼之前，我曾嘗試在 stackoverflow 上查找此內容...

#article p {
    display: block;
    text-align:center;
    text-indent:0!important;
}

我現在知道這個“#workskin p.chapter”ID 選擇器將不起作用，因為我沒有將它添加到我的代碼中，因為我無法訪問完整的主題代碼。

這是我用來制作縮進的 css 代碼，也是我在 css 編輯器中為 wordpress“p”段落元素所擁有的唯一代碼...

article p {
    text-indent: 30px;
}

對於居中對齊的文本，我無法使縮進消失。

我想讓我的居中對齊文本以我的網站為中心，而不是從中心額外縮進 30 像素。 例如：

• 以標題為中心，無縮進
• 第一段縮進
• 段落二縮進
• 打破以段落為中心的無縮進
• 段落三縮進
• 段落四縮進
• 以段落為中心打斷，沒有縮進......等

這是我第一次使用 css。 通常我有一個完整的主題來查看代碼，並且我能夠使用 color# 進行小的編輯並更改圖像的 src ，但這是我編碼知識的范圍，我在每次谷歌搜索和評論。 這是我需要在我的網站上進行的最后一次代碼編輯，我感謝大家的評論和幫助。

Answer 1

您可以將類放在要從中排除的 p 上，例如：

article p {
    text-indent: 30px;
}

// try changing it to this remember exclude is class on p tags you want to exclude
// Dont forget the dot (.) before exclude
// and the !important is after the value
article .exclude {
    text-indent: 10px !important; // you put !important here
    color: red !important; // like this
    padding: 10px !important; // like this
}

確保在 NONE EXCLUDED 下排除 P 來重寫它
仔細查看代碼注釋

希望它是hepfull

Answer 2

CSS 中的特殊性的順序是 Type selector(h1, p ,div...) < Class selector(rules with a period .) < ID selector(rules with #) 但規則定義為! important ! important覆蓋當然的任何其他聲明；) 如上所述，如果為同一元素添加不同的規則集，即針對具有相同特性的元素的規則，那么 CSS 將使用稍后定義的規則（即最新的規則）示例：

    p{
        color : red ;
    }
    p{
        color : green ;
    }

在這個例子中，段落中文本的顏色將是綠色而不是紅色，因為綠色是在紅色之后定義的規則。

    p{
        color : red ! important;
    }
    p{
        color : green ;
    }

但這里是因為! important ! important是添加到紅色p內的文本顏色將是紅色。

因此，在您的情況下，您可以定義text-align: center ! important text-align: center ! important或只是定義規則覆蓋您在特定p tag不想要的規則，但這可以通過在普通p標簽的規則之后定義它的特定 CSS 規則來完成

首先將正常或默認規則定義為

article p { 
    text-indent: 30px; 
    }

在此之后添加特定規則

#worskin p .chapter {
    display: block;
    text-align:center; 
    text-indent:0; 
    }

感謝 AuxTaco 的建議。