尝试选择每个第三个（扬声器）div以清除内容被集中在一起的浮动。
每隔一个div就是一个模态弹出窗口＆amp;它似乎与n-child或nth-of-type冲突？
请参阅下面的示例，其中我已经注释掉了顶行模态类。
.custom-speakers .speaker:nth-of-type(2n+1)
{
clear:both;
background:#FAFAFA;
border:1px solid #FFF;
}<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>STEP OVER EVERY MODAL NTH-CHILD / NTH-OF-TYPE</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row custom-speakers">
<div class="speaker col-sm-6"><h2>SPEAKER 1</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 2</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 3</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 4</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 5</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 6</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 7</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 8</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 9</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 10</h2></div>
<!--<div class="modal fade"></div>-->
<div class="speaker col-sm-6"><h2>SPEAKER 11</h2></div>
<!--<div class="modal fade"></div>-->
</div>
<br>
<hr>
<br>
<div class="row custom-speakers">
<div class="speaker col-sm-6"><h2>SPEAKER 1-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 2-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 3-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 4-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 5-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 6-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 7-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 8-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 9-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 10-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 11-2</h2></div>
<div class="modal fade"></div>
</div>
</div>
</body>
</html>
答案 0 :(得分：0)
这与模态弹出窗口无关。 :nth-of-type()仅选择其类型（标记，元素）的第n个子项。不幸的是，没有CSS选择器，例如nth-of-class。
根据@Eduardo Wada（css3 nth of type restricted to class），我们可以为感兴趣的元素添加一个特殊的类：
$(".custom-speakers .speaker").filter(function(index){
return index % 2 == 0;
}).addClass("interested-speaker");
答案 1 :(得分：0)
这似乎有效：
.custom-speakers>div:nth-child(4n+5)
{
clear:both;
background:#ddd;
border:1px solid #FFF;
}<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>STEP OVER EVERY MODAL NTH-CHILD</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row custom-speakers">
<div class="speaker col-sm-6"><h2>SPEAKER 1-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 2-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 3-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 4-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 5-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 6-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 7-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 8-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 9-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 10-2</h2></div>
<div class="modal fade"></div>
<div class="speaker col-sm-6"><h2>SPEAKER 11-2</h2></div>
<div class="modal fade"></div>
</div>
</div>
</body>
</html>