การสร้างแบบฟอร์มง่ายๆ ใน Bootstrap

Booststap Knowledge ความรู้สำหรับการออกเว็บเพื่อให้แสดงผล ได้ดี ทุกหน้าจอ

Moderator: mindphp, ผู้ดูแลกระดาน

m038
PHP Sr. Member
PHP Sr. Member
โพสต์: 59
ลงทะเบียนเมื่อ: 29/07/2016 10:40 am

การสร้างแบบฟอร์มง่ายๆ ใน Bootstrap

โพสต์โดย m038 » 30/07/2016 3:03 pm

การสร้างแบบฟอร์มง่ายๆ ใน #Bootstrap นั้นสามารถทำได้ดังนี้
    - ประกาศหัวข้อแบบฟอร์มที่เราต้องการ

โค้ด: เลือกทั้งหมด

<h1><center>ตัวอย่างแบบฟอร์ม</center></h1>

    - ประกาศแบบฟอร์ม

โค้ด: เลือกทั้งหมด

<form>ข้อมูลต่างๆ ที่ต้องใส่ภายในฟอร์ม</form>

    - สร้างการกรอกข้อมูลที่เราต้องการ เช่นตัวอย่างนี้เป็นการให้กรอก Email

โค้ด: เลือกทั้งหมด

  <form class="form-inline">
    <div class="form-group">
      <label>Email :</label>
      <input type="email" class="form-control" id="email" placeholder="กรอก email ของท่าน">
    </div>
  </form>

* placeholder คือการแสดงข้อความในช่อง input
    - สร้างการกรอกรหัสผ่านของ Email ที่ต้องการ

โค้ด: เลือกทั้งหมด

  <form class="form-inline">
    <div class="form-group">
      <label>Email :</label>
      <input type="email" class="form-control" id="email" placeholder="กรอก email ของท่าน">
    </div>
    <div class="form-group">
      <label for="pwd">Password:</label>
      <input type="password" class="form-control" id="pwd" placeholder="กรอก password ของท่าน">
    </div>
  </form>
 

    - สร้างปุ่มเพื่อบันทึกข้อมูลแบบฟอร์ม

โค้ด: เลือกทั้งหมด

<center><button type="submit" class="btn btn-default">บันทึกข้อมูล</button></center>

  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ย้อนกลับไปยัง

ผู้ใช้งานขณะนี้

กำลังดูบอร์ดนี้: 2 และ บุคคลทั่วไป 0 ท่าน