CSS繼承和特異性

我遇到了一個CSS樣式表的問題。我將它縮小爲關於css風格的繼承和特異性。CSS繼承和特異性

眼下（簡體）我有一個HTML <body>，看起來像下面這樣：

<div id="page-wrap"> 
    <div class="unilogin-wrap"> 
     <h1 class="unilogin-h1">Hello world!</h1> 
    </div> 
</div>

現在，這是一個需要在幾個網站，因此使用UNI-登錄表單的一部分它具有獨特的unilogin風格的樣式表。然而，在該網站的樣式表（style.css文件）設置如下：

#page-wrap h1{ 
    font-size:18px; 
    margin-bottom: 18px; 
    margin-left:15px; 
}

而在unilogin樣式表（unilogin.css）設置如下：

.unilogin-wrap h1.unilogin-h1 { 
    padding:0; 
    margin:0; 
    font-size:18px; 
    color:#596168; 
    text-shadow: 1px 1px 0px #fff; 
}

但是這不會覆蓋從style.css繼承的h1樣式。如果我把#page-wrap h1.unilogin-h1{}，而不是它工作得很好。但這不是一個選項，因爲它必須在幾個不同樣式表的網站上工作，我不能只是改變它。

是否有任何方法可以在不使用內聯html樣式的情況下重寫第二個樣式表中繼承的h1樣式的特殊性？（我知道style =「」html屬性具有更高的特異性，但我更喜歡將樣式保留在樣式表中）。

謝謝...

2011-07-10 Simon

在'unilogin.css'你的意思是使用'＃unilogin，wrap'？因爲在你的HTML中它是'id'而不是'class'。 –

對不起，在我的文章中輸入錯了 - 我會編輯它.. – Simon

嘗試改變.unilogin-wrap h1.unilogin-h1 {

到

#unilogin-wrap h1.unilogin-h1 {

因爲.unilogin-wrap作用<whatever class="unilogin-wrap"和#unilogin-wrap上<whatever id="unilogin-wrap"

2011-07-10 11:54:19 atlau

的多個結構解決方案：給＃頁面包裝類也

<div id='page-wrap' class='page_wrap'>

，然後設置普通樣式時引用類。（使用ID只爲絕對定位和個人，隱藏/顯示）

使用其他方法！重要

margin:0 !important;

顯然，如果依靠這麼多它變得容易受污染和惡夢維持，但對於特殊情況，它可能是你需要的。

2011-07-10 11:48:30 Inca

回答