如何应用内部Bootstrap / CSS Padding？

Question

嗨我有一堆动态 div正在生成，但我不知道如何在内部填充它们并将它们与左右边缘对齐？  任何帮助将不胜感激。

Answer 1

您可以执行以下操作：

[class*="col-"] {
  padding-right: 15px;
  padding-left: 15px;
}

[class*="col-"]:first-child {
  padding-left: 0px;
}

[class*="col-"]:last-child {
  padding-right: 0px;
}

  

您可以添加一个内容来包装它，否则您将这些规则应用于您的布局中的所有列！

.spaced-columns [class*="col-"] {
  padding-right: 15px;
  padding-left: 15px;
}

那么你可以使用：

<div class="spaced-columns">
  <div class="col-md-4"> your content here</div>
  <div class="col-md-4"> your content here</div>
  <div class="col-md-4"> your content here</div>
</div>

所以你可以根据需要设置间距：）

干杯

Answer 2

我建议检查一下bootstrap。大多数css适合你：

http://getbootstrap.com/examples/grid/

Answer 3

你可以把你的div放在<div class="col-md-4">之内，或者你可以简单地添加一个类，如：<div class="col-md-4 my-class">并添加一些填充，如：

.my-class {
   padding: 10px;
}

如果您选择添加idder div，则将填充添加到<div class="col-md-4">并简单地设置内部div的样式。

<div class="col-md-4">
   <div class="my-class">Text</div>
</div>

风格如下：

.col-md-4 {
   padding: 10px;
}

.my-class {
   background: red;
}

Answer 4

如果你将列盒包装成a，你应该没问题。如果填充仍然关闭，您可以更改行的边距，然后您不需要弄乱各个列div。

实施例

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