2013-08-27 47 views
1

試圖重寫行類的默認留下的,哪些是Bootstrapc3:重寫排左,右頁邊距

.row .row { 
margin-right: -15px; 
margin-left: -15px; 
} 

右頁邊距有多個rows
HTML

<div class="row row-padded" id="question1"></div> 
<div class="row row-padded" id="question2"></div> 
<div class="row row-padded" id="question3"></div> 

CSS

.row-padded { 
    margin-top:15px; 
    padding-left:25px; 
    padding-top:10px; 
    padding-bottom:10px; 
} 

它工作正常,如果我用id覆蓋它。這工作得很好一行

#question1 { 
margin-left:0px; 
margin-right:0px; 
} 

但這並不

div[id^='question'] { 
    margin-left:0px; 
    margin-right:0px; 
} 

enter image description here

+0

它對我有用:http://jsbin.com/orafIco/1/edit –

+0

我正在使用Bootstrap 3.請嘗試。 –

回答

2

您需要了解的特異性是如何工作的。 div[id^='question']不覆蓋.row .row的原因是因爲它只有一個元素和一個屬性選擇器(考慮與一個類相同的特異性),而後者有兩個類選擇器 - 類在特定性中覆蓋常規元素,所以有意義的是兩個組合的類比一個類和一個元素具有更高的優先級。還要記住一個ID會覆蓋類和元素選擇器。

如果你想第二選擇工作,嘗試:

div.row[id^='question'] { 
margin-left: 0px; 
margin-right: 0px; 
} 
0

嘗試爲重要標誌的保證金性質:

div[id^='question'] { 
    margin-left:0px !important; 
    margin-right:0px !important; 
} 
1
<style> 
.row{ 
margin-left: 0px; 
margin-right: 0px; 
} 
</style> 

在您的網頁提供這些代碼,以便它將覆蓋默認屬性。