如何更改引导程序表单的方向，文本向右，文本框向左

Question

此链接的示例

<form class="form-horizontal" role="form" action="#">
  <div class="form-group">
    <label class="col-sm-2 control-label">עיר</label>
    <div class="col-sm-10">
      <input class="form-control" id="Text5" type="text"/>
    </div>
  </div>
  <div class="form-group">
    <label class="col-sm-2 control-label">רחוב</label>
    <div class="col-sm-3">
      <input class="form-control" id="Text6" type="text" />
    </div>
    <label class="col-sm-2 control-label">מס'</label>
    <div class="col-sm-5">
      <input class="form-control" type="text" />
    </div>
  </div>

我想改变方向：从右向左。text-右侧，textbox-左侧

Answer 1

您可以在窗体子元素上使用direction: rtl;

.form-horizontal * {
  direction: rtl;
}

<form class="form-horizontal" role="form" action="#">
  <div class="form-group">
    <label class="col-sm-2 control-label">עיר</label>
    <div class="col-sm-10">
      <input class="form-control" id="Text5" type="text"/>
    </div>
  </div>
  <div class="form-group">
    <label class="col-sm-2 control-label">רחוב</label>
    <div class="col-sm-3">
      <input class="form-control" id="Text6" type="text" />
    </div>
    <label class="col-sm-2 control-label">מס'</label>
    <div class="col-sm-5">
      <input class="form-control" type="text" />
    </div>
  </div>

Answer 2

只需创建一个名为bootstrap-ext-rtl.css的文件||bootstrap-xt-rtl.module.css包含：

.rtl { direction: rtl}
.ltr { direction: ltr}
.bidi-rtl{ direction: rtl; unicode-bidi: bidi-override }
/* with/without text-align or whatever you want :P */

Answer 3

您可以使用文本权限类。