【问题标题】：Align text in bootstrap col fields对齐引导列字段中的文本
【发布时间】：2014-11-01 08:51:34
【问题描述】：

我需要使用引导程序在 html 中显示名称值对。我将“col-md-1”类用于名称和值列，因此数据显示在两列中。问题在于，由于 bootstrap 将屏幕分为 12 列，因此在字段值内容的左侧和右侧留下了很多空间。我尝试使用“text-left”、“text-right”类，但它似乎不能与“col-md-”类一起使用。如何在引导列（例如 col-md-）中将文本左对齐或右对齐，而不将样式左或右硬编码为某些像素？

   <div class="row">
      <div class="col-md-1">column1</div>
      <div class="col-md-1"><p class="text-right">Name</p></div>
      <div class="col-md-1"><p class="text-left">Value</p></div>
      <div class="col-md-1">column4</div>
      <div class="col-md-1">column5</div>
      <div class="col-md-1">column6</div>
      <div class="col-md-1">column7</div>
      <div class="col-md-1">column8</div>
      <div class="col-md-1">column9</div>
      <div class="col-md-1">column10</div>
      <div class="col-md-1">column11</div>
      <div class="col-md-1">column12</div>
  </div>

【问题讨论】：

标签： twitter-bootstrap text alignment

【解决方案1】：

试试这个：

使用'row' class ，它将避免填充

 <div class="col-md-1"><p class="row text-right">Name</p></div>
 <div class="col-md-1"><p class="row text-left">Value</p></div>

DEMO

【讨论】：

【解决方案2】：

希望得到帮助你可以像下面这样使用它

<div class="col-md-1 text-center">

详情请看以下链接 Jsfiddle

欢迎任何进一步的问题

谢谢罗希特

【讨论】：

它似乎不起作用。尝试在浏览器中打开你的 html，而不是 jsfiddle。
你能把你的代码上传到fiddle吗？我想研究一下……其实很担心对引导库的引用。

【解决方案3】：

此代码还可以将引导行中的列内容居中：

<div class="row text-center">

【讨论】：