สำหรับคลาส container นั้น จะมีขนาดที่จำเพาะในแต่ละขนาดหน้าจอ (xs, sm, md, lg) ส่วน คลาส container-fluid จะขยายจนเต็มหน้าจอ เนื่องจากมีการระบุไว้ใน media query ของไฟล์ bootstrap.css  ประมาณบรรทัดที่ 1390 เป็นต้นไป

Untitled

จะสังเกตว่า คลาส container นั้นจะมี media query ที่กำหนด size มาตรฐานไว้ 3 size ซึ่งเมื่อขนาดหน้าจออยู่ในช่วงที่กำหนด ขนาดของ container ก็จะ scale ไปตามค่าดังกล่าว ซึ่งจะมีขนาดเล็กว่า ขนาดของหน้าจอโดยอัตโนมัติ ซึ่งจะทำให้เวลาเรานำไปใช้งานจะมีพื้นที่ขอบด้านข้างคงเหลือไว้เสมอ ส่วนคลาส container-fluid นั้นจะ scale จนเต็มขนาดหน้าจอ คงไว้แต่ค่า padding เท่านั้นครับ

แหล่งอ้างอิง

http://stackoverflow.com/questions/9780333/fluid-or-fixed-grid-system-in-responsive-design-based-on-twitter-bootstrap

Advertisements

ใส่ความเห็น

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / เปลี่ยนแปลง )

Twitter picture

You are commenting using your Twitter account. Log Out / เปลี่ยนแปลง )

Facebook photo

You are commenting using your Facebook account. Log Out / เปลี่ยนแปลง )

Google+ photo

You are commenting using your Google+ account. Log Out / เปลี่ยนแปลง )

Connecting to %s