Bootstrap การจัดการ grid เพื่อให้รองรับกับหน้าจอทุกขนาด xs sm md lg  สร้างคำถาม

 2,006 view  หมวดหมู่ : สำหรับโปรแกรมเมอร์  วันที่สร้าง : 04/12/2017

Bootstrap การจัดการ grid เพื่อให้รองรับกับหน้าจอทุกขนาด xs sm md lg

เรื่องของการจัดการ Content ให้เป็น Responsive ทุกวันนี้ถือได้ว่าเป็นเรื่องปรกติที่ทุก website จะต้องทำกัน
เพราะ client ของเราไม่ได้มีแค่ PC อีกต่อไป แต่มีทั้ง mobile , tablet , pc ซึ่งแต่ละ device ก็มีหน้าจอหลากหลายขนาด
วันนี้เราจะมาทบทวนการจัดการหน้าจอของ Bootstrap ในรูปแบบ grid
โดยการกำหนดความกว้างของ tag div
ตาม format col-ขนาดหน้าจอ-ความกว้างที่ต้องการ
โดยขนาดหน้าจอประกอบด้วย
- xs (for phones - ความกว้างหน้าจอน้อยกว่า 768px )
- sm (for tablets - ความกว้างหน้าจอมากกว่าหรือเท่ากับ 768px )
- md (for small laptops - ความกว้างหน้าจอมากกว่าหรือเท่ากับ 992px )
- lg (for laptops and desktops - ความกว้างหน้าจอมากกว่าหรือเท่ากับ 1200px )
วิธีการกำหนดค่าก็คือ
col-xs-6
col-sm-6
col-lg-6


ถ้าชอบบทความนี้ กด Like เลย :Bootstrap การจัดการ grid เพื่อให้รองรับกับหน้าจอทุกขนาด xs sm md lg
TAGS : Bootstrap   Javascript   Programming   เขียนโปรแกรม  
 2,006 view  หมวดหมู่ : สำหรับโปรแกรมเมอร์  วันที่สร้าง : 04/12/2017



SOA,Java,XSLT

 ร่วมแสดงความคิดเห็นได้ที่นี่




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

เนื้อหาที่เกี่ยวช้อง

  Hadoop คืออะไร ทำความรู้จักกับ Apache Hadoop ในการรับมือกับ Big Data ถามเมื่อ (2017-02-07)   4,393 views  (ดูล่าสุดเมื่อ 7 นาที)

  Oracle Field ประเภท Varchar2 เก็บได้กี่ตัวอักษร ถามเมื่อ (2017-03-03)   3,406 views  (ดูล่าสุดเมื่อ 9 นาที)

  Java script sort Text ผมเรียงแล้วเจอปัญหาครับ Z มาก่อน m ถามเมื่อ (2012-09-12)   2,876 views  (ดูล่าสุดเมื่อ 13 นาที)

  Oracle PLSQL แก้ปัญหา Query ใน function ช้ากว่า Query ปรกติด้วย DETERMINISTIC Hint ถามเมื่อ (2017-06-01)   2,107 views  (ดูล่าสุดเมื่อ 13 นาที)

  java pass by value pass by reference ต่างกันยังไง ถามเมื่อ (2011-08-29)   3,593 views  (ดูล่าสุดเมื่อ 13 นาที)

  ตัวอย่าง Ajax jquery กับ Spring framework ถามเมื่อ (2013-03-25)   3,927 views  (ดูล่าสุดเมื่อ 15 นาที)

  PLSQL Sub String ด้วยคำสั่ง substr วิธีใช้งาน ถามเมื่อ (2012-11-28)   6,691 views  (ดูล่าสุดเมื่อ 15 นาที)

  jQuery กำหนดให้รอ response จาก AJAX ด้วย option async ถามเมื่อ (2019-06-01)   2,591 views  (ดูล่าสุดเมื่อ 24 นาที)

  คำสั่ง Unix VI เบื้องต้น รู้คร่าวๆ พอให้แก้ปัญหาเฉพาะหน้าได้นะ ถามเมื่อ (2018-04-24)   2,406 views  (ดูล่าสุดเมื่อ 27 นาที)

  Highcharts javascript กำหนด Tooltip เพื่อแสดงผลด้วยตัวเอง ถามเมื่อ (2017-03-03)   2,057 views  (ดูล่าสุดเมื่อ 28 นาที)


 

บ้านเดียวกันดอทคอม เว็บถามตอบ รวมทุกเรื่องที่คุณอยากรู้ ให้ความรู้ ความบันเทิง มีสาระ
www.ban1gun.com