ล่าสุดการพัฒนาเว็บบทเรียน

×

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อ้างอิง CSS แสดงสินค้า

❮ก่อนหน้า ถัดไปอ้างอิง❯

Bootstrap แสดงสินค้า

มุมโค้งมน:

Cinque Terre

วงกลม:

Cinque Terre

Thumbnail:

<img> เรียน

เรียนด้านล่างสามารถใช้ในรูปแบบภาพใด ๆ :

ชั้น	ลักษณะ	ตัวอย่าง
.img-rounded	เพิ่มมุมโค้งมนไปยังรูปภาพ (ไม่สามารถใช้ได้ใน IE8)	ลองมัน
.img-circle	รูปร่างภาพไปยังวงกลม (ไม่สามารถใช้ได้ใน IE8)	ลองมัน
.img-thumbnail	รูปร่างที่ภาพเพื่อภาพขนาดย่อ	ลองมัน
.img-responsive	ทำให้ภาพการตอบสนอง (จะขนาดไว้อย่างสวยงามเพื่อองค์ประกอบหลัก)	ลองมัน

แสดงสินค้าที่ตอบสนองต่อ

สร้างภาพการตอบสนองโดยการเพิ่ม .img-responsive ระดับไป <img> แท็ก ภาพแล้วจะขนาดไว้อย่างสวยงามเพื่อองค์ประกอบหลัก

.img-responsive ระดับใช้ max-width: 100% , height: auto และ display:block ไปยังภาพที่:

ตัวอย่าง

<img src="cinqueterre.jpg" class="img-responsive" alt="Cinque Terre">

ลองตัวเอง»

❮ก่อนหน้า ถัดไปอ้างอิง❯