bootstrap 表单-水平左对齐

Question

有人可以告诉我如何将用户名标签左对齐吗？

 <form class="form-horizontal">
    <div class="form-group">
        <label class="control-label col-sm-3" for="username">Username</label>
        <div class="col-sm-9">
            <input type="text" class="form-control" id="username" placeholder="Enter username">
        </div>
    </div>
</form>

原文由 thimal deemantha 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

需要删除 form-horizontal

 <form >
    <div class="form-group">
        <label class="control-label col-sm-3"for="username">Username</label>
        <div class="col-sm-9">
            <input type="text" class="form-control" id="username" placeholder="Enter username">
        </div>
    </div>
</form>

注意：如果你想要任何 text-left 或 right 然后使用 text-left 或 text-right 类，但你的代码在没有这些类的情况下也能正常工作。

阅读本文档

http://getbootstrap.com/css/

您可以进一步使用 grid-framework.less 文件作为视图，它将管理行中的数据（以进行更多控制）

原文由 jitendra varshney 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

您可以通过向其添加一个额外的类然后通过 CSS 将其浮动来将标签浮动到左侧。

  <label class="control-label col-sm-3 label" for="username">Username</label>

.label { float: left; }

https://jsfiddle.net/p0pob33d/

原文由 Pingbeat 发布，翻译遵循 CC BY-SA 3.0 许可协议