Bootstrap เป็นเฟรมเวิร์กส่วนหน้ายอดนิยม พูดง่ายๆก็คือชุดเครื่องมือสำหรับ HTML, CSS และ JavaScript เราสามารถใช้ Bootstrap เพื่อสร้างเว็บไซต์หรืออินเทอร์เฟซซอฟต์แวร์ที่เรียบง่ายและสดใหม่ ด้วย bootstrap นักพัฒนาแบ็คเอนด์ไม่ต้องกังวลเกี่ยวกับการสร้างอินเทอร์เฟซส่วนหน้าอีกต่อไป
Bootstrap เป็นชุดเครื่องมือโอเพ่นซอร์สสำหรับการพัฒนาส่วนหน้าที่เปิดตัวโดย Twitter ซึ่งเป็นกรอบ CSS/HTML Bootstrap ให้ข้อมูลจำเพาะ HTML และ CSS ที่สง่างามซึ่งเขียนขึ้นในภาษา CSS แบบไดนามิกน้อยลง มันเป็นโครงการโอเพ่นซอร์สยอดนิยมใน GitHub
มันได้รับการพัฒนาขึ้นอยู่กับกรอบงาน jQuery และมีความเป็นมนุษย์มากขึ้นและเป็นส่วนตัวมากขึ้นตามเฟรมเวิร์ก jQuery สร้างชุดของสไตล์เว็บไซต์ที่เป็นเอกลักษณ์ของตัวเองและเข้ากันได้กับปลั๊กอิน jQuery ส่วนใหญ่
Bootstrap (1) มีส่วนประกอบของเว็บมากมายตามส่วนประกอบเหล่านี้คุณสามารถสร้างเว็บไซต์ที่สวยงามและใช้งานได้อย่างสมบูรณ์ มันมีส่วนประกอบต่อไปนี้: เมนูแบบเลื่อนลง, กลุ่มปุ่ม, เมนูแบบดรอปดาวน์ปุ่ม, การนำทาง, แถบนำทาง, breadcrumbs, เพจ, การเรียงพิมพ์, รูปขนาดย่อ, กล่องโต้ตอบเตือน, แถบความคืบหน้า, กล่องโต้ตอบสื่อ ฯลฯ (2) มันมาพร้อมกับปลั๊กอิน jqery 13 ตัว เหล่านี้รวมถึง: กล่องโต้ตอบโหมด, แท็บ, แถบเลื่อน, กล่องป๊อปอัพ ฯลฯ
คำอธิบายของ bootstrap บนเว็บไซต์ภาษาจีนคือ:
รองเท้าบู๊ต
กรอบการพัฒนาส่วนหน้าง่ายที่ใช้งานง่ายและมีประสิทธิภาพทำให้การพัฒนาเว็บได้เร็วขึ้นและง่ายขึ้น
ดาวน์โหลด: http://v3.bootcss.com/
หลังจากดาวน์โหลดคุณสามารถดูไดเรกทอรีและไฟล์ต่อไปนี้ซึ่งวางไว้ในไดเรกทอรีที่แตกต่างกันตามหมวดหมู่ และมีสองเวอร์ชัน: บีบอัดและไม่บีบอัด
หลังจากดาวน์โหลดแพ็คเกจบีบอัดแล้วคลายซิปลงในไดเรกทอรีใด ๆ และคุณจะเห็นโครงสร้างไดเรกทอรีต่อไปนี้:
นี่คือองค์กร bootstrap ขั้นพื้นฐานที่สุด: ไฟล์ที่ไม่ได้บีบอัดสามารถใช้โดยตรงในโครงการเว็บใด ๆ เราให้บริการบีบอัด (bootstrap.min.*) และไม่มีการบีบอัด (bootstrap.*) ไฟล์ CSS และ JS ไฟล์ไอคอนแบบอักษรมาจากไกลฟิคอน
เทมเพลตพื้นฐาน
ใช้เทมเพลต HTML ที่เรียบง่ายสุด ๆ ด้านล่างหรือแก้ไขกรณีเหล่านี้ ขอแนะนำให้แก้ไขกรณีเหล่านี้ตามความต้องการของคุณเองแทนที่จะคัดลอกหรือวาง
คัดลอกและวางรหัส HTML ที่ให้ไว้ด้านล่างนี่เป็นหน้า bootstrap ที่ง่ายที่สุด
<! doctype html> <html> <head> <title> bootstrap 101 เทมเพลต </title> <meta name = "viewport" content = "width = ความกว้างของอุปกรณ์, ระดับเริ่มต้น = 1.0"> <!-bootstrap-> <link rel = "stylesheet" href = "http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css"> <!-html5 shim และตอบกลับถ้าคุณไม่ได้รับการสนับสนุน lt IE 9]> <script src = "http://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.min.js"> </script> <script src = "http://cdn.bootcss.com/responding.js/ <! [endif]-> </head> <body> <h1> สวัสดีโลก! </h1> <!-jQuery (จำเป็นสำหรับปลั๊กอิน JavaScript ของ bootstrap)-> <script src = "http://cdn.bootcss.com/jquery/1.10.2/jquery.min ตามต้องการ-> <script src = "http://cdn.bootcss.com/twitter-bootstrap/3.0.3/js/bootstrap.min.js"> </script> </body> </html>
ข้างต้นเป็นความรู้ที่เกี่ยวข้องเกี่ยวกับบันทึกการเรียนรู้ bootstrap แนะนำให้คุณรู้จักโดยบรรณาธิการ ฉันหวังว่ามันจะเป็นประโยชน์กับคุณ!