Question

如何删除Bootstrap网格中缩略图之间的边距？我希望缩略图并排而不是边缘......

这是用于显示缩略图的代码。 http://www.bootply.com/rrlpsBWCrx

<div class="col-md-1" style="margin-right:0px; margin-left:0px; display:inline-block;">
  <a href="#" class="thumbnail goodPick" style="display: inline-block; margin: 0px 0px 0px 0px;">
    <img src="http://cdn.dota2.com/apps/dota2/images/heroes/earthshaker_vert.jpg" class="img-responsive" alt="Earthshaker">
  </a>  
</div>
<div class="col-md-1" style="margin-right:0px; margin-left:0px; display:inline-block;">
  <a href="#" class="thumbnail goodPick" style="display: inline-block; margin: 0px 0px 0px 0px;">
    <img src="http://cdn.dota2.com/apps/dota2/images/heroes/earthshaker_vert.jpg" class="img-responsive" alt="Earthshaker">
  </a>  
</div>
<div class="col-md-1" style="margin-right:0px; margin-left:0px; display:inline-block;">
  <a href="#" class="thumbnail goodPick" style="display: inline-block; margin: 0px 0px 0px 0px;">
    <img src="http://cdn.dota2.com/apps/dota2/images/heroes/earthshaker_vert.jpg" class="img-responsive" alt="Earthshaker">
  </a>  
</div>
<div class="col-md-1" style="margin-right:0px; margin-left:0px; display:inline-block;">
  <a href="#" class="thumbnail goodPick" style="display: inline-block; margin: 0px 0px 0px 0px;">
    <img src="http://cdn.dota2.com/apps/dota2/images/heroes/earthshaker_vert.jpg" class="img-responsive" alt="Earthshaker">
  </a>  
</div>
<div class="col-md-1" style="margin-right:0px; margin-left:0px; display:inline-block;">
  <a href="#" class="thumbnail goodPick" style="display: inline-block; margin: 0px 0px 0px 0px;">
    <img src="http://cdn.dota2.com/apps/dota2/images/heroes/earthshaker_vert.jpg" class="img-responsive" alt="Earthshaker">
  </a>  
</div>

Answer 1

元素有填充：http://www.bootply.com/9X6g2U425y

.col-md-1 {
    padding: 0;
}

我是怎么找到的？您可以右键单击一个元素，然后按＆＃34;检查元素＆＃34;。您将能够在Browsers Developer Tool中看到apllyed样式。

使用Bootstrap网格从缩略图中删除边距

1 个答案: