Bootstrap คืออะไร?
Bootstrap เป็นเฟรมเวิร์กส่วนหน้าสำหรับการพัฒนาอย่างรวดเร็วของเว็บแอปพลิเคชันและเว็บไซต์ Bootstrap ขึ้นอยู่กับ HTML, CSS และ JavaScript
ประวัติศาสตร์
Bootstrap ได้รับการพัฒนาโดย Mark Otto และ Jacob Thornton ของ Twitter Bootstrap เป็นผลิตภัณฑ์โอเพ่นซอร์สที่วางจำหน่ายใน GitHub ในเดือนสิงหาคม 2011
เนื้อหาของแพ็คเกจ bootstrap
โครงสร้างพื้นฐาน: Bootstrap จัดเตรียมโครงสร้างพื้นฐานด้วยระบบกริดสไตล์การเชื่อมโยงและพื้นหลัง สิ่งนี้จะถูกอธิบายโดยละเอียดในส่วนโครงสร้างพื้นฐาน bootstrap
CSS: Bootstrap มาพร้อมกับคุณสมบัติดังต่อไปนี้: การตั้งค่า CSS ทั่วโลก, คำจำกัดความของรูปแบบองค์ประกอบ HTML พื้นฐาน, คลาสที่ขยายได้และระบบกริดขั้นสูง สิ่งนี้จะถูกอธิบายโดยละเอียดในส่วน Bootstrap CSS
ส่วนประกอบ: Bootstrap มีส่วนประกอบที่นำกลับมาใช้ใหม่ได้มากกว่าหนึ่งโหลสำหรับการสร้างภาพเมนูแบบเลื่อนลงการนำทางกล่องเตือนกล่องป๊อปอัพและอื่น ๆ สิ่งนี้จะถูกอธิบายโดยละเอียดในส่วนองค์ประกอบเลย์เอาต์
ปลั๊กอิน JavaScript: Bootstrap มีปลั๊กอิน jQuery ที่กำหนดเองมากกว่าหนึ่งโหล คุณสามารถรวมปลั๊กอินทั้งหมดโดยตรงหรือทีละตัว สิ่งนี้จะอธิบายอย่างละเอียดในส่วนปลั๊กอิน bootstrap
การปรับแต่ง: คุณสามารถปรับแต่งส่วนประกอบ bootstrap ตัวแปรน้อยลงและปลั๊กอิน jQuery เพื่อรับเวอร์ชันของคุณเอง
ข้างต้นเป็นข้อความต่อไปนี้ นี่คือ ความรู้เกี่ยวกับการกำหนดค่าแบบฟอร์มบล็อก ดังต่อไปนี้:
ฉันเชื่อว่าเพื่อนของฉันต้องเผชิญกับสถานการณ์ที่หน้าแก้ไขมีหลายช่วงตึก ปลั๊กอินสมาร์ทฟอร์มได้รองรับสถานการณ์นี้สำหรับคุณ
รหัสมีดังนี้ (ที่อยู่ลิงค์: https://github.com/xiexingen/bootstrap-smartform/blob/master/demo/form2-group-layout.html):
<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> รูปแบบกลุ่ม </title> <link rel = "stylesheet" href = "../ css/bootstrap.css"> <! src = "../ lib/jQuery.js"> </script> <script src = "../ lib/bootstrap.js"> </script> <!-วิธีการเครื่องมือ-> <script src = "../ scripts/global.js"> </script> <! src = "../ scripts/plugin.js"> </script> </head> <body> <div> <divel นั่นคือรายการการกำหนดค่าการจัดกลุ่มเป็นรูปแบบของ 'กลุ่ม: config item' </h3> </div> </div> </div> </div> <dunction () {// // โปรดทราบว่าเมื่อกำหนดค่าเป็นแบบฟอร์มกลุ่มรายการการกำหนดค่าเป็นวัตถุ JSON แทนอาร์เรย์ var eles = {' ข้อมูล ': [[{ele: {type:' text ', ชื่อ:' ชื่อผู้ใช้ ', ชื่อเรื่อง:' ชื่อผู้ใช้: ', ต้องการ: true}}, {ele: {ประเภท:' วิทยุ ', ชื่อ:' เพศ ', ชื่อ: ], [{ele: {type: 'ช่องทำเครื่องหมาย', ชื่อ: 'Plant', ชื่อ: 'การใช้งาน แพลตฟอร์ม: ', รายการ: [{text:' app ', value:' app '}, {text:' web ', value:' web '}]}}, {ele: {type:' select ', ชื่อ:' provi nce ', title:' จังหวัด: ', withnull: จริง, รายการ: [{text:' guangdong ', ค่า:' gd '}, {text:' hunan ', ค่า:' hn '}]}} ], 'ข้อมูลอื่น ๆ ': [{ele: {type: 'text', ชื่อ: 'displayName', ชื่อเรื่อง: 'displayName:'}}, [{ele: {type: 'datetime', ชื่อ: 'fromedate', ชื่อ: 'toDate' ]}; // องค์ประกอบที่ซ่อนอยู่ส่วนใหญ่ใช้สำหรับการแก้ไขพื้นหลังสามารถแยกแยะได้ไดอะแกรมการรันเอฟเฟกต์: (รายการการกำหนดค่าปัจจุบันมีสองส่วน: ข้อมูลผู้ใช้และข้อมูลอื่น ๆ )
ข้างต้นเป็นคำอธิบายแบบเต็มของการกำหนดค่าแบบฟอร์มการใช้งานแบบฟอร์ม Smart Form (III) Bootstrap Smart Form (III) ที่แนะนำโดยตัวแก้ไข ฉันหวังว่ามันจะเป็นประโยชน์กับคุณ หากคุณมีคำถามใด ๆ โปรดฝากข้อความถึงฉันและบรรณาธิการจะตอบกลับคุณทันเวลา ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Wulin.com!