Bootstrap: Vô hiệu hóa tính năng Responsive

Mặc đinh, Bootstrap sẽ tự động thay đổi các trang của bạn cho phù hợp với các kích thước màn hình khác nhau. Tuy nhiên nếu như bạn muốn vô hiệu hóa tính năng này, hãy tham khảo tài liệu của chúng tôi bên dưới, và khi đó trang web của bạn sẽ hoạt động giống như ví dụ này.

Các bước để vô hiệu hóa tính năng responsive

1. Hãy bỏ thẻ <meta> viewport đã được đề cập đến trong tài liệu CSS
2. Hãy ghi đè thuộc tính width trên .container đối với mỗi cột trong hệ thống lưới, ví dụ width: 970px !important; Hãy chắc chắn rằng, các mã CSS tùy biến này được tích hợp vào sau CSS mặc định của Bootstrap. Bạn cũng có thể tránh sử dụng !important bằng các media query hoặc một số selector-fu.
3. Nếu bạn sử dụng thanh điều hướng, hãy vô hiệu hóa toàn bộ các tính năng thu gọn và mở rộng trên thanh điều hướng đó.
4. Đối với các bố cục dạng lưới, hãy sử dụng class .col-xs-* bằng cách thêm vào hoặc thay thế cho các class medium/large. Đừng lo lắng, hệ thống lưới trên các thiết bị có màn hình siêu nhỏ sẽ tự động co giãn đối với mọi độ phân giải.

Bạn sẽ vẫn cần phải có Respond.js để chạy được trên trình duyệt IE8 (vì các media query của chúng tôi vẫn ở đó và cần được xử lý).

Template của Bootstrap với tính năng responsive bị vô hiệu hóa

Ví dụ sau đây được tạo ra bằng cách áp dụng những bước đã nói ở trên, hãy tham khảo mã nguồn của nó để thấy được những thay đổi được áp dụng.