บทช่วยสอน แผงบูต ที่ดีที่สุดในปี 2024 ในบทช่วยสอนนี้ คุณสามารถเรียนรู้ ตัวอย่าง,ชื่อแผง,ตัวอย่าง,แผงเชิงอรรถ,ตัวอย่าง,แผงบริบทที่มีสี,ตัวอย่าง,กับแผงตาราง,ตัวอย่าง,ที่มีรายชื่อในกลุ่มของแผง,ตัวอย่าง,

แผงบูต

บทนี้จะอธิบายแผง Bootstrap (แผ่น) ประกอบแผง DOM สำหรับการชุมนุมถูกแทรกลงในกล่อง สร้างแผงขั้นพื้นฐานจะต้อง <div>และเพิ่มระดับชั้น.panel .panel เริ่มต้นสามารถเป็นที่แสดงในตัวอย่างต่อไปนี้:

ตัวอย่าง

<div class = "แผงแผงเริ่มต้น" > <div class = "แผงร่างกาย"> นี้เป็นแผงพื้นฐาน </ div> </ div>

ลอง»

ผลมีดังนี้

แผงเริ่มต้น

ชื่อแผง

เรามีสองวิธีที่ดีในการเพิ่มชื่อแผง:

  • ใช้คลาส .panel หัวข้อก็สามารถเพิ่มชื่อเพื่อภาชนะแผงสามารถเพิ่มภาชนะหัวข้อที่แผงของคุณ
  • ใช้กับการเรียน .panel ชื่อของ <h1> - <H6> เพื่อเพิ่มลักษณะหัวเรื่องที่กำหนดไว้ล่วงหน้า

ตัวอย่างต่อไปนี้แสดงให้เห็นถึงนี้ในสองวิธี

ตัวอย่าง

<div class = "แผงแผงเริ่มต้น" > <div class = "แผงหัวข้อ"> ชื่อแผงไม่มีชื่อ </ div> <div class = "แผงร่างกาย"> แผงเนื้อหา </ div> </ div> <div class = "แผงแผงเริ่มต้น" > <div class = "แผงหัวข้อ"> <H3 class = "แผงชื่อ"> มีชื่อของชื่อแผง </ h3> </ div> <div class = "แผงร่างกาย"> แผงเนื้อหา </ div> </ div>

ลอง»

ผลมีดังนี้

ชื่อแผง

แผงเชิงอรรถ

เราสามารถเพิ่มเชิงอรรถในแผงเพียงแค่ใส่ข้อความบนปุ่มหรือระดับ .panel ท้ายด้วย <div> สามารถตัวอย่างต่อไปนี้แสดงให้เห็นถึงจุดนี้:

ตัวอย่าง

<div class = "แผงแผงเริ่มต้น" > <div class = "แผงร่างกาย"> นี้เป็นแผงพื้นฐาน </ div> <div class = "แผงท้าย"> แผงเชิงอรรถ </ div> </ div>

ลอง»

ผลมีดังนี้

แผงเชิงอรรถ
แผงเชิงอรรถได้รับมรดกของสีและสีของเส้นขอบจากแผงกับบริบทเพราะมันไม่ได้อยู่ในเนื้อหาเบื้องหน้า

แผงบริบทที่มีสี

ใช้บริบทระดับสถานะแผงหลักแผงสำเร็จ แผงข้อมูลแผงเตือนแผงอันตราย ที่จะตั้งแผงสีกับบริบทตัวอย่างดังต่อไปนี้:

ตัวอย่าง

<div class = "แผงแผงหลัก" > <div class = "แผงหัวข้อ"> <H3 class = "แผงชื่อ"> ชื่อแผง </ h3> </ div> <div class = "แผงร่างกาย"> นี้เป็นแผงพื้นฐาน </ div> </ div> <div class = "แผงแผงประสบความสำเร็จ" > <div class = "แผงหัวข้อ"> <H3 class = "แผงชื่อ"> ชื่อแผง </ h3> </ div> <div class = "แผงร่างกาย"> นี้เป็นแผงพื้นฐาน </ div> </ div> <div class = "แผงแผงข้อมูล" > <div class = "แผงหัวข้อ"> <H3 class = "แผงชื่อ"> ชื่อแผง </ h3> </ div> <div class = "แผงร่างกาย"> นี้เป็นแผงพื้นฐาน </ div> </ div> <div class = "แผงแผงเตือน" > <div class = "แผงหัวข้อ"> <H3 class = "แผงชื่อ"> ชื่อแผง </ h3> </ div> <div class = "แผงร่างกาย"> นี้เป็นแผงพื้นฐาน </ div> </ div> <div class = "แผงแผงอันตราย" > <div class = "แผงหัวข้อ"> <H3 class = "แผงชื่อ"> ชื่อแผง </ h3> </ div> <div class = "แผงร่างกาย"> นี้เป็นแผงพื้นฐาน </ div> </ div>

ลอง»

ผลมีดังนี้

แผงบริบทที่มีสี

กับแผงตาราง

การสร้างตารางที่มีเส้นขอบในแผงไม่มีเราสามารถใช้ .tableชั้นในแผงสมมติว่ามี <div> มี.panel ร่างกายเราสามารถเพิ่มชายแดนเป็นพิเศษในด้านบนของตารางที่จะแยกถ้ามันไม่ได้.panel ร่างกายของ <div> ส่วนประกอบจะย้ายโดยไม่หยุดชะงักจากแผงไปหัวตาราง

ตัวอย่างต่อไปนี้แสดงให้เห็นถึงจุดนี้:

ตัวอย่าง

<div class = "แผงแผงเริ่มต้น" > <div class = "แผงหัวข้อ"> <H3 class = "แผงชื่อ"> ชื่อแผง </ h3> </ div> <div class = "แผงร่างกาย"> นี้เป็นแผงพื้นฐาน </ div> <table class = "ตาราง"> <Th> ผลิตภัณฑ์ </ TH> <TH> ราคา </ TH> <tr> <td> ผลิตภัณฑ์ </ td> <td> 200 </ td> </ tr> <tr> <td> ผลิตภัณฑ์ B </ td> <td> 400 </ td> </ tr> </ table> </ div> <div class = "แผงแผงเริ่มต้น" > <div class = "แผงหัวข้อ"> ชื่อแผง </ div> <table class = "ตาราง"> <Th> ผลิตภัณฑ์ </ TH> <TH> ราคา </ TH> <tr> <td> ผลิตภัณฑ์ </ td> <td> 200 </ td> </ tr> <tr> <td> ผลิตภัณฑ์ B </ td> <td> 400 </ td> </ tr> </ table> </ div>

ลอง»

ผลมีดังนี้

กับแผงตาราง

ที่มีรายชื่อในกลุ่มของแผง

เราสามารถจะรวมอยู่ในรายชื่อของกลุ่มแผงใด ๆ โดยการเพิ่ม.panel และชั้น .panel เริ่มต้นใน<div> เพื่อสร้างแผงและเพิ่มรายชื่อของกลุ่มในแผงควบคุม คุณสามารถเลือกจาก รายการของกลุ่ม ที่จะเรียนรู้วิธีการสร้างกลุ่มรายชื่อบท

ตัวอย่าง

<div class = "แผงแผงเริ่มต้น" > <div class = "แผงหัวข้อ"> ชื่อแผง </ div> <div class = "แผงร่างกาย"> <p> นี่คือเนื้อหาพื้นฐานของแผง นี่คือเนื้อหาพื้นฐานของแผง นี่คือเนื้อหาพื้นฐานของแผง นี่คือเนื้อหาพื้นฐานของแผง นี่คือเนื้อหาพื้นฐานของแผง นี่คือเนื้อหาพื้นฐานของแผง นี่คือเนื้อหาพื้นฐานของแผง นี่คือเนื้อหาพื้นฐานของแผง </ p> </ div> <ul class = "รายชื่อกลุ่ม"> <li class = "รายการกลุ่มรายการ "> ลงทะเบียนชื่อโดเมนฟรี </ li> <li class = "รายการกลุ่มรายการ "> ฟรีหน้าต่างพื้นที่โฮสติ้ง </ li> <li class = "รายการกลุ่มรายการ "> จำนวนภาพ </ li> <li class = "รายการกลุ่มรายการ "> 24 * 7 สนับสนุน </ li> <li class = "รายการกลุ่มรายการ "> การปรับปรุงค่าใช้จ่ายประจำปี </ li> </ ul> </ div>

ลอง»

ผลมีดังนี้

ที่มีรายชื่อในกลุ่มของแผง
แผงบูต
10/30