アラビア語の書式を設計しようとしています。私はパネルクラスを使用しました。テキストフィールドは一般的に左側から始まりますが、フォームを右から左に設計したいと考えています。RTL言語をサポートするために、ブートストラップの列を右から左に整列させます。
.heading {
font-family: monospace;
font-size: 30px;
color: #0D91A5;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="col-md-12 ">
<center>
<h2 class="heading"> Registration</h2>
</center>
</div>
<div class="container" style="margin-top:30px">
<div class="col-md-10 col-md-offset-1">
<div class="panel panel-info" style="direction: rtl;">
<div class="panel-heading">
<h3 class="panel-title"><strong class="strong"> تفاصيل طالب | Executive Details</strong></h3>
</div>
<div class="panel-body">
<div class="row">
<div class=".col-sm-5 .col-md-6" style="direction: rtl;">
<div class="form-group col-md-12 ">
<div class="col-md-6 col-xs-12 col-xs-12 col-md-offset-6">
<input type="text" name="id_no" id="id_no" class="form-control" placeholder=" رقم| ID Number" tabindex="1">
</div>
<div class="col-md-6 col-xs-12 col-md-offset-0">
<input class="form-control" type="text" name="name" id="name" class="form-control" placeholder=" اسم| Name " tabindex="1">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
これは私が右側に始めるが、他は別の行から同じGROMでtextfiledテキストフィールドのオフセット-6クラスを使用していますコーディングされます。同じ行にボックスフィールドが必要です。
誰もが私が使用したいクラスを教えてできますか?またはbootsrapのCSSファイルを変更することはできますか? (bootstrap.css
ファイルの後に)bootstrap-rtl.css
を追加し、RTLのサポートに関連するすべてのCSSプロパティをオーバーライドします
<link href="css/bootstrap.css" rel="stylesheet" />
<link href="css/bootstrap-rtl.css" rel="stylesheet" />
:RTLのレイアウトを使用Bootstrap RTLを設計する
右側のdivをフロートさせるプル・ライト・クラスを使用 –
Plunkrで問題なく動作していますか? –