Bootstrap 5 ขอบเขต

ระยะเวลาที่สามารถกำหนดได้

เพื่อตั้งรูปแบบสำหรับระบบเลือกตัวเลข .form-range เพิ่มคลาสถึงประกาศ input ที่มี type="range":

ระยะเวลาที่สามารถกำหนดได้:

ตัวอย่าง

<label for="customRange" class="form-label">ระยะเวลาที่สามารถกำหนดได้</label>
<input type="range" class="form-range" id="customRange">

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

ขั้นตอนเลื่อน

โดยเริ่มต้น ช่วงการแบ่งแยกของตัวเลขในระยะเป็น 1 คุณสามารถใช้ step เปลี่ยนค่าของอุปกรณ์:

ตัวอย่าง

<input type="range" class="form-range" step="10">

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

ค่าต่ำที่สุดและค่าสูงสุด

โดยเริ่มต้น ค่าต่ำที่สุดเป็น 0 และค่าสูงสุดเป็น 100 คุณสามารถใช้ min และ/หรือ max เปลี่ยนค่าของอุปกรณ์:

ตัวอย่าง

<input type="range" class="form-range" min="0" max="4">

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