0

我使用 bootstrap2.3.1 得到了这样的视图：

<div class="row-fluid">
    <div class="span3">text1</div>
    <div class="span3">text2</div>
    <div class="span3">text3</div>
    <div class="span3">text4</div>
</div>

当我过滤它以仅显示带有 text2 的 div 时，我将其他 div 显示设置为无。但是因为带有 text1 的 div 仍然是第一个子元素，所以带有 text2 的 div 有一个左边距。我该如何改变它，所以它只放 margin-left: 0; 给第一个有显示块的孩子？

过滤后的视图如下所示：

<div class="row-fluid">
    <div class="span3" style="display: none;">text1</div>
    <div class="span3">text2</div>
    <div class="span3" style="display: none;">text3</div>
    <div class="span3" style="display: none;">text4</div>
</div>

引导程序中的以下 CSS 将边距删除到第一个孩子：

.row-fluid [class*="span"]:first-child {
    margin-left: 0;
}

我想我应该做这样的事情：（但不是正确的语法）

.row-fluid [class*="span"]:first-child[display="block"] {
    margin-left: 0;
}
4

1 回答 1

2

这是您的奇异选择器（演示）：

.row-fluid [class^="span"]:not([style="display: none;"]) {
    margin-left: 0;
}

但是，目前无法选择第一类，因此该规则将应用于所有匹配的元素。.spanX我建议您在显示/隐藏元素时切换 Bootstrap 类 ( )。

于 2013-09-05T11:50:38.140 回答