Bootstrap 4 Grid System là mấu chốt cho khả năng tương thích giao diện (web responsive) của Bootstrap. Khi khởi động Bootstrap, giao diện của nó sẽ hiển thị dưới dạng lưới (grid). Bootstrap được chia thành 12 cột đặt trong một class row. Trong đó, mỗi cột sẽ bao gồm các Padding tương ứng với từng độ phân giải của mỗi thiết bị (điện thoại, tablet, máy tính).

Bootstrap 4 Grid System có 5 lớp

• .col-(extra small devices – chiều rộng màn hình < 576px)
• .col-sm-(small devices – chiều rộng màn hình >= 576px)
• .col-md-(medium devices – chiều rộng màn hình >= 768px)
• .col-lg-(large devices – chiều rộng màn hình >= 992px)
• .col-xl-(xlarge devices – chiều rộng màn hình >= 1200px)

Tham khảo thêm: Bootstrap là gì? Cài đặt Bootstrap, web chuẩn responsive