Bootstrap 5 ประเมินเลือก

เมนูเลือก

เลือกเมนู (เลือกหนึ่งตัว):

เลือกเมนูหลายตัว (กด Ctrl หรือ Shift หรือใช้เมาส์ลาดเลือกหลายตัว):

ถ้าคุณต้องการที่จะอนุญาตให้ผู้ใช้เลือกจากหลายตัวเลือก ใช้เมนูเลือก

ถ้าคุณต้องการที่จะอนุญาตให้ผู้ใช้เลือกจากหลายตัวเลือก ใช้เมนูเลือก .form-select เพื่อเพิ่มคลาสเข้าไปในองค์ประกอบ <select>:

ตัวอย่าง

<select class="form-select">
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>

ลองทดสอบด้วยตัวเอง

ขนาดเมนูเลือก

กรุณาใช้ .form-select-lg หรือ .form-select-sm เพื่อเปลี่ยนขนาดเมนูเลือก ใช้คลาส:

ตัวอย่าง

<select class="form-select form-select-lg">
<select class="form-select">
<select class="form-select form-select-sm">

ลองทดสอบด้วยตัวเอง

เลือกเมนูความคงที่

กรุณาใช้ disabled คุณสมบัติเลือกเมนูความคงที่

ตัวอย่าง

<select class="form-select" disabled>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>

ลองทดสอบด้วยตัวเอง

รายการเลือกข้อมูล

Bootstrap ยังสามารถตั้งรูปแบบตามรายการเลือกข้อมูลได้ ซึ่งเป็นรายการตัวเลือกที่เป็นไปตามแบบอินพุท:</input>

กรุณาเลือกเบราเซอร์ของคุณจากรายชื่อ:

ตัวอย่าง

<label for="browser" class="form-label">กรุณาเลือกเบราเซอร์ของคุณจากรายชื่อ:</label>
<input class="form-control" list="browsers" name="browser" id="browser">
<datalist id="browsers">
  <option value="Edge">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

ลองทดสอบด้วยตัวเอง