ปรับขนาด textbox Bootstrap ให้ใหญ่ขึ้น หรือเล็กลง

ปรับขนาด textbox Bootstrap ให้ใหญ่ขึ้น หรือเล็กลง บทความนี้สอนการใช้คำสั่ง font-size, width และ height เพื่อปรับขนาด textbox หรือ input type text ของ Bootstrap ให้ใหญ่ขึ้น หรือเล็กลง สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง ปรับขนาด textbox Bootstrap ให้ใหญ่ขึ้น หรือเล็กลง

1. ใช้คำสั่ง font-size ปรับให้ตัวอักษรใหญ่ขึ้น เล็กลง ส่งผลให้ textbox ปรับขนาดตามตัวอักษร

<input type="text" class="form-control" placeholder="กรอกข้อมูล" style="font-size:2rem;">

2. ให้ขนาดตัวอักษรเท่าเดิม แต่ต้องการให้ textbox สูงขึ้นใช้คำสั่ง height

<input type="text" class="form-control" placeholder="กรอกข้อมูล" style="height:100px;">

3. ให้ขนาดตัวอักษรเท่าเดิม ความสูงเท่าเดิม แต่ความกว้างเปลี่ยนแปลงใช้คำสั่ง width

<input type="text" class="form-control" placeholder="กรอกข้อมูล" style="width:80%;">