Buzz
Fluid Layout sử dụng tỷ lệ để đo lường các phần nội dung, hình ảnh, ... Bố cục thích ứng với kích thước cửa sổ. Đọc thêm trong bài học Bootstrap của Mytour để biết cách tạo Fluid Layout với Bootstrap.
Hướng dẫn chi tiết tạo Fluid Layout với Bootstrap
Hướng dẫn tạo Fluid Layout với Bootstrap
Trong Bootstrap, sử dụng lớp .container-fluid để tạo bố cục Fluid Layout chiếm 100% chiều rộng của viewport trên mọi thiết bị, kích thước màn hình (cực nhỏ, nhỏ, trung bình, lớn và cực lớn).
Lớp .container-fluid sử dụng width: 100% cho mọi kích thước viewport, vẫn giữ tính đáp ứng và có thể sử dụng lớp lưới bình thường.
Ví dụ: dưới đây là một Fluid Layout bao phủ toàn bộ chiều rộng của màn hình.
Kết quả trả về sẽ hiển thị như sau:
Trong bài học này, Mytour đã hướng dẫn cách tạo Fluid Layout với Bootstrap. Các bài học tiếp theo sẽ giới thiệu cách tạo giao diện Responsive cho trang web với Bootstrap.
Nếu có thắc mắc hoặc câu hỏi, bạn đọc có thể để lại ý kiến trong phần bình luận dưới bài viết.
