Bootstrap 5 အချက်အလက် ပါဝင်

အဆောက်အအုံ ပုံစံ

အစားထိုးစား .form-control အစိတ်အသုံးပြုထားသော <input> နှင့် <textarea> အစိတ်အသုံးပြုထားသော အရေးပါသော ပုံစံကို ရရှိနိုင်ပါသည်:

实例

<form action="/action_page.php">
  <div class="mb-3 mt-3">
    <label for="email" class="form-label">ကျန့်မှုနည်းပြည့်စား：</label>
    <input type="email" class="form-control" id="email" placeholder="ကျန့်မှုနည်းပြည့်စား သုံးပါ" name="email">
  </div>
  

    
    
  </div>
  

    
  </div>
  
</form>

亲自试一试

另外请您注意，我们为每个 label 元素添加了 .form-label 类以确保正确的填充。

复选框有不同的标记。它们被设置了 .form-check 类的容器元素包围。label 设置 .form-check-label 类，而复选框和单选按钮使用 .form-check-input。

Textarea

实例

亲自试一试

表单行 / 网格（行内表单）

အက်ဥ္စည်းများ တစ်လျှောက် ပြသချင်ရှိကြောင်း ကျွန်ုပ်သည် အသုံးပြုပါသည် .row နှင့် .col：

实例

<form>
  <div class="row">
    <div class="col">
      <input type="text" class="form-control" placeholder="ပြင်ဆင်ပါ အိမ်ရှယ်လိုင်းအမည်" name="email">
    </div>
    <div class="col">
      <input type="password" class="form-control" placeholder="ပြင်ဆင်ပါ လက်မှတ်" name="pswd">
    </div>
  </div>
</form>

亲自试一试

မင်းကို Bootstrap 网格 章节中学到有关列和行的更多内容。

表单控件尺寸

您可用 .form-control-lg 或 .form-control-sm 更改 .form-control 输入控件的大小：

实例

亲自试一试

禁用和只读

请使用 disabled 和/或 readonly 属性禁用输入字段：

实例

亲自试一试

纯文本输入

请使用 .form-control-plaintext 类来设置没有边框的输入字段的样式，但保留适当的外边距和内边距：

实例

亲自试一试

拾色器

如需正确设置 type="color" 的输入样式，请使用 .form-control-color 类：

实例

亲自试一试