什麼是CSS中元素/標籤的順序

如果我的問題不適合這個場地，我很抱歉。我閱讀了詢問幫助信息，但沒有看到這個問題無法提問。什麼是CSS中元素/標籤的順序

在CSS樣式表中，HTML元素的順序是否重要？我「Google搜索」了我的問題，大多數答案都說沒關係，有幾個說不一樣。

CSS代碼中的HTML定義標籤，「h1-h6」，「p」，「a」等之前是否有「div」和「ids」？以下是我的HTML代碼。因此，在CSS代碼中，我會在HTML定義的標籤之前使用「ID」嗎？

 <div id="header"> 
      <h1>Relax and Restore</h1> 
       <h3>Breathe</h3> 
     </div><!--/#header--> 

      <p>Welcome to Calmness</p> 

     <div id="nav"> 
      <ul> 
       <li><a href="index.html" target="_blank">Home</a></l1> 
       <li><a href="benefits.html" target="_blank">Benefits</a></l1> 
       <li><a href="learn-more.html" target="_blank">Learn More</a></l1> 
      </ul> 
     </div><!--/#nav-->

謝謝

來源

2014-02-13 user2847948

讓我們這個問題，除了案件逐案：

是否在一個單一的選擇順序回事？
只要選擇器是有效的，沒關係。

作爲樣品：

h1#id.class

和

h1.class#id

都是有效的和相等的選擇器，並且將所述元件<h1 id="id" class="class">匹配。

下面是不是一個有效的選擇，除非你有id="idh1"

.class#idh1

元素是否在單行訂購回事？
非常非常。

以下選擇

.class1 .class2

匹配具有class="class2"具有的class="class1"父這樣所有元素：

<div class="class1"> 
    <div class="class2"> 
    </div> 
</div>

而選擇器

.class2 .class1

將匹配相對遏制

<div class="class2"> 
    <div class="class1"> 
    </div> 
</div>

在CSS文件裏面的順序是否有問題？
不，只要你不想覆蓋以前的規則。

下都是有效的，平等的：

#id {...} 
h6 {...}

和

h6 {...} 
#id {...}

建議的附加詞：
CSS從右工程左。我不能強調這一點。
雖然性能不是許多樣式表編寫者的問題，但您仍然希望編寫出色的代碼。你永遠不知道什麼時候你最終在一個負載很重的web項目上工作。
給元素類比通過它們的dom元素類型及其父類型更好。

作爲短例如，一個壞的選擇：

.class1 > *

，並與相應的DOM的改變，更好的解決方案：

.class1 > .class2

推理：第一選擇上述的第一選擇每然後過濾那些具有合適父級的人員，第二個需要在DOM中做更多工作，但是如果您的網站很繁重，則會提供明顯更好的結果。

作爲一個簡單的經驗法則，如果你有以上的東西，附加一個類，而不是節點選擇器。

來源

2014-02-13 16:50:15 Nit

的順序很重要。第一個元素應該是你的默認值，比如你的全局DOM元素（p，h1，h2，a等）。

你放一個元素越低，它就會覆蓋表單上更高的元素。而且，你定位一個元素越具體，它越有可能具有更高的重要性。例如，

.header .nav p {color:white}

將覆蓋

p {color:red}

希望這有助於

來源

2014-02-13 15:30:00 httpgio

如果我沒有理解這個問題吧...你的CSS文件中沒有順序並不重要。它根據風格的特殊性選擇它的風格。使用id比使用類更具體。使用類比元素更具體，依此類推。也就是說，如果兩個規則具有相同的特異性水平（一個常見的原因是重複使用相同的類名），那麼最後定義的那個將是使用的那個。

來源

2014-02-13 15:37:11 neverlucky13

您對錯了。這個命令很重要。 – httpgio

答案是肯定的，不是。沒有任何定義的方法必須編寫css，換句話說，您可以以任何您想要的方式混合元素（div，p，a，ul），ids（#header，#content）和類。

但順序會影響瀏覽器如何使用您的CSS。瀏覽器從上到下應用樣式，這意味着文件開頭的樣式將被文件末尾的樣式覆蓋。

由於httpgio和neverlucky13指出更具體的規則將覆蓋更通用的規則，無論文件的順序如何。儘量保持簡單並創建類，而不是直接設計DOM元素的樣式，至少在獲得一點經驗之前。

如果你的CSS文件是這樣的：

<div id="blue" class="red">Blue</div> 
<div class="red">Red</div>

第一個div將有藍色的文本和第二紅色文字

Demo

所有這一切也適用於當您使用多個樣式表。

來源

2014-02-13 15:45:14

我相信你不太明白這個問題。 – Nit

他的回答有什麼問題？我認爲這很準確。 – httpgio

什麼是CSS中元素/標籤的順序

回答

相關問題