確定CSS選擇器的部分優先級

在數學中，操作順序提供了操作優先的基本輪廓，並提供括號作爲重寫此順序的方式。例如，x + y * z = x + (y * z)但是x + y * z != (x + y) * z。確定CSS選擇器的部分優先級

有沒有辦法在CSS中實現這種效果？哪些選擇者優先考慮，如何強制低優先選擇優先？

2017-08-08 BoxTechy

AFAIR加載順序定義優先級，你只能用'玩！important' –

你所說的「其選擇優先」的意思是這是我不清楚。一個複合選擇器一次只有一個主題。例如，選擇器E F + G只有一個主題：G，順序是（E F）+ G還是E（F + G）無關緊要 - 它總是與給定頁面中的相同G元素相匹配。這是[是在CSS選擇器中允許使用圓括號嗎？]（https://stackoverflow.com/questions/5478920/are-parentheses-allowed-in-css-selectors）的重複，我不知道。 – BoltClock

你在找什麼叫Specificity。鏈接的文章解釋得非常好。

基本上，該選擇器具有優先級是基於選擇器是如何具體。作爲一個有點直觀的例子，.red.fruit更具有特定而不僅僅是.fruit，因爲它有兩個類名。因此，在您的CSS代碼中，即使.fruit選擇器出現在.red.fruit之後，更具體的選擇優先。

不僅僅是有多個類名，還有更多。你可以想象，不同的類型選擇器有不同的優先級。例如，ID選擇器被認爲是非常具體的，因爲只有一個元素可以（好，應該）具有給定的ID。在一般情況下，該順序是這樣的，從最具體到最不：

內聯樣式> ID選擇器>類，屬性，和僞類選擇器>元素和僞元素

絕對閱讀文章更多信息。

現在，所有的說，我認爲這是值得一提的是，作爲一個很好的經驗規則，你的目標應該是讓你的選擇爲最具體越好。換句話說，儘量不要使用ID選擇器或內聯樣式，以避免它，並使用最少數量的類名來選擇所需的元素。

根據這一原則，可以讓你的CSS是從長遠來看，更靈活，更易於閱讀。

來源

2017-08-08 22:03:46 Auroratide

有多種方法可以優先考慮CSS規則對HTML元素的影響。數將包括更具體的選擇，如下圖所示：

section { background-color: red; } 

section.header { background-color: green; }

在上述示例中，與類標頭的部分優先因爲要包括一個更具體的選擇器。

其他考慮是你如何在你的CSS樣式表（內聯，嵌入式和外部）拉動。

在這個特定的情況下，包含內聯的CSS規則將優先於嵌入式CSS規則，這將優先於經由外部樣式表應用的規則的元件。

考慮到這些因素和考慮，你應該能夠拿出比別人優先考慮一定的規則的幾種不同的方式。

更多在這裏閱讀： What is the order of precedence for CSS?

來源

2017-08-08 22:02:21 eulloa

確定CSS選擇器的部分優先級

回答

相關問題