2016-07-25 196 views
-2

我有兩個單獨的CSS文件,每個樣式都是頁面的某個部分。具體來說,我爲主內容(header,footer等)製作了一個內容,另一個用於可能是動態的主要內容。我只是將這兩個CSS文件鏈接到頁面,但似乎「主要內容」的風格正在超越「主內容」的風格。如何解決這個問題呢 ?或者如何限制第二個css文件只能定位我可以定義的特定HTML部分的樣式? 我已經試過!重要的CSS屬性。CSS衝突問題

+2

請向我們展示您的CSS。 –

+0

@Robert哥倫比亞它只是兩個鏈接的css文件,它將需要太多的線來查看它們 – MaryBaker

+0

你的問題已經在這裏回答http://stackoverflow.com/questions/9459062/in-which-order-do-css- stylesheets-override –

回答

0

我只是連接的兩個CSS文件的頁面,但看來,「主要內容」的 風格是騎在「主 內容」的風格。

那是因爲你建立了一些風格,當你加載主內容樣式表,然後加載主要內容的樣式表 ...然後重寫了一些你已經聲明的樣式。

這是級聯。這是應該發生什麼

E.g.

如果您在主內容樣式表有:

header h1 { 
color: blue; 
} 

,然後,在這之後,你主要內容樣式表您有:

h1 { 
color: red; 
} 

<h1>(在<header>)將是red


補充:

您將通過與DOM查看(個),您的瀏覽器(S)重新認識自己做自己一個巨大的青睞。

我的選擇是Firefox和Firebug的,另一些人喜歡Chrome和Chrome的DevTools

一個DOM查看器將能夠顯示您正在被應用到元素的樣式以及它們被應用的順序...

...所以你可以看到哪些樣式被覆蓋其他(後來的)風格。

+1

是的,這是真的我想我應該記住這一點。那麼現在我將不得不通過我的文件並搜索級聯選擇器或者有另一種方法? – MaryBaker

+0

通過熟悉DOM Inspector(s)爲您的瀏覽器,您可以獲得巨大的利益。我的偏好是Firefox和Firebug,其他人更喜歡Chrome和Chrome DevTools等.DOM Inspector將能夠告訴你哪些樣式正在被應用到元素以及它們被應用的順序......所以你可以看到哪些樣式正在被其他(後來的)風格所覆蓋。 – Rounin

0

你應該避免!重要的地方,只要你可以。這是不好的做法。使用更好的類名稱作爲定位元素。你應該閱讀一下CSS的特性以及像SMACSS或BEM這樣的良好的類命名約定。