css - Bootstrapc3：覆盖行左右边距

Question

试图覆盖行类的默认左右边距，它们是

.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;
}

Answer 1

您需要了解特异性是如何工作的。div[id^='question']不覆盖的原因.row .row是因为它只有一个元素和一个属性选择器（被认为与类具有相同的特异性），而后者有两个类选择器 - 类在特异性上覆盖常规元素，因此两个类组合是有意义的比一个类和一个元素具有更高的优先级。还要记住，ID 会覆盖类和元素选择器。

如果您希望第二个选择器工作，请尝试：

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

Answer 2

<style>
.row{
 margin-left: 0px;
 margin-right: 0px;
}
</style>

在您的页面中提供这些代码，以便它覆盖默认属性。

Answer 3

尝试将边距属性标记为重要：

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