ฟอรั่ม | ล่าสุดการพัฒนาเว็บบทเรียน
×

Bootstrap เกี่ยวกับการสอน

BS บ้าน BS เริ่ม BS กินกัน BS การเรียงพิมพ์ BS ตาราง BS ภาพ BS jumbotron BS Wells BS การแจ้งเตือน BS ปุ่ม BS กลุ่มปุ่ม BS Glyphicons BS ป้าย / ป้าย BS แถบความคืบหน้า BS การให้เลขหน้า BS Pager BS กลุ่มรายการ BS แผง BS เมนูแบบเลื่อนลง BS Collapse BS แท็บ / ยา BS Navbar BS ฟอร์ม BS Inputs BS Inputs 2 BS Input Sizing BS ม้าหมุน BS เป็นกิริยาช่วย BS เคล็ดลับ BS Popover BS Scrollspy BS ติด

Bootstrap ระบบกริด

BS ระบบกริด BS ซ้อนกัน / แนวนอน BS ตารางขนาดเล็ก BS ตารางขนาดกลาง BS ตารางขนาดใหญ่ BS ตัวอย่างตาราง

Bootstrap ธีม

BS แม่แบบ BS กระทู้ "Simply Me" BS กระทู้ "Company" BS กระทู้ "Band"

Bootstrap Exam

BS ทดสอบ

Bootstrap CSS Ref

CSS การเรียงพิมพ์ CSS ปุ่ม CSS ฟอร์ม CSS ผู้ช่วย CSS ภาพ CSS ตาราง CSS เมนูแบบเลื่อนลง CSS Navs Glyphicons

Bootstrap JS Ref

JS ติด JS เตือนภัย JS ปุ่ม JS Carousel JS Collapse JS เลื่อนลง JS Modal JS Popover JS Scrollspy JS แถบ JS เคล็ดลับ

 

Bootstrap Tables


Bootstrap ตารางพื้นฐาน

พื้นฐาน Bootstrap ตารางมี padding แสงและวงเวียนแนวนอนเท่านั้น

.table ระดับเพิ่มจัดแต่งทรงผมพื้นฐานในตาราง:

ตัวอย่าง

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
ลองตัวเอง»

แถวลาย

.table-striped คลาสเพิ่มม้าลายลายตาราง:

ตัวอย่าง

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
ลองตัวเอง»

ตารางที่ล้อมรอบ

.table-bordered ชั้นเพิ่มเส้นขอบทุกด้านของตารางและเซลล์:

ตัวอย่าง

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
ลองตัวเอง»

แถวเลื่อน

.table-hover ชั้นช่วยให้รัฐวางเมาส์เหนือแถวตาราง:

ตัวอย่าง

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
ลองตัวเอง»

ตารางที่ควบแน่น

.table-condensed ระดับทำให้ตารางขนาดกะทัดรัดมากขึ้นโดยการตัดช่องว่างภายในเซลล์ในช่วงครึ่งปี:

ตัวอย่าง

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
ลองตัวเอง»

การเรียนการสอนตามบริบท

เรียนบริบทสามารถใช้ในการแถวตารางสี ( <tr> ) หรือเซลล์ตาราง ( <td> ):

ตัวอย่าง

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
ลองตัวเอง»

เรียนตามบริบทที่สามารถใช้:

ชั้น ลักษณะ
.active การใช้สีที่โฉบไปแถวของตารางหรือเซลล์ของตาราง
.success บ่งชี้ว่ามีการดำเนินการที่ประสบความสำเร็จหรือบวก
.info บ่งชี้ว่ามีการเปลี่ยนแปลงข้อมูลที่เป็นกลางหรือการกระทำ
.warning แสดงให้เห็นคำเตือนว่าอาจจำเป็นต้องให้ความสนใจ
.danger บ่งชี้ว่ามีการกระทำที่เป็นอันตรายหรือเชิงลบ

ตารางที่ตอบสนองต่อ

.table-responsive ระดับสร้างตารางการตอบสนอง ตารางแล้วจะเลื่อนตามแนวนอนบนอุปกรณ์ขนาดเล็ก (ภายใต้ 768px) เมื่อดูในสิ่งที่มีขนาดใหญ่กว่า 768px กว้างไม่มีความแตกต่าง:

ตัวอย่าง

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>
ลองตัวเอง»

ทดสอบด้วยตัวเองด้วยการออกกำลังกาย!

การใช้สิทธิ 1 » ออกกำลังกาย 2 » ออกกำลังกาย 3 » 4 การออกกำลังกาย» ออกกำลังกาย 5 » ออกกำลังกาย 6 »


สมบูรณ์ Bootstrap Table Reference Bootstrap Table Reference

สำหรับอ้างอิงที่สมบูรณ์ของการเรียนโต๊ะให้ไปที่เราสมบูรณ์ Bootstrap อ้างอิงตาราง