2013-09-23 50 views
9

Tôi chỉ muốn xóa một điều. Nếu tôi đang sử dụng "container-fluid" lớp, nó có nghĩa là tôi không thể có một cái gì đó như thế này trong bootstrap.css:Twitter Bootstrap "chứa chất lỏng"

.container-fluid{ 
width: 1170px; 
} 

Tôi cố gắng để thiết lập tính theo pixel và tính chất đáp ứng đơn giản là tắt. Trong khi thiết lập trong% nó hoạt động. Nói cách khác, câu hỏi của tôi là như thế này: Làm thế nào tôi có thể thiết lập chiều rộng cố định của container-chất lỏng? Hay đơn giản là nó không có nghĩa là các nhà phát triển bootstrap mặc định?

Tôi đã đọc liên kết này: Fluid or fixed grid system, in responsive design, based on Twitter Bootstrap

Nhưng chỉ đơn giản là không thể tìm thấy bất cứ điều gì có liên quan đến tính chất đáp ứng và chiều rộng cố định với container-fluid.

+0

phản hồi nghĩa là chiều rộng sẽ được quyết định theo kích thước khung nhìn. Đưa chiều rộng về tỷ lệ phần trăm cũng không chính xác vì nó sẽ bóp méo bằng cách nào đó trên một số thiết bị tốt hơn để sử dụng chiều rộng tối đa ở đây. – Amit

Trả lời

18

thiết lập chiều rộng px là làm cho nó tĩnh, bạn sẽ phải sử dụng một kỹ thuật khác để làm cho nó đáp ứng sau đó như javascript đó là lý do tại sao một% được sử dụng.

Nếu bạn đang muốn làm cho container không đi rộng hơn 1170px sử dụng

.container-fluid { 
    max-width:1170px; 
} 

max-width sẽ làm cho nó vì vậy nếu màn hình người dùng rộng hơn 1170px container sẽ đi chỉ lên đến 1170px rộng. Điều này sẽ làm cho nó để các cơ chế đáp ứng vẫn sẽ làm việc.

Tất nhiên sử dụng .container-fluid làm công cụ chọn sẽ thay đổi cách tất cả các yếu tố container-fluid hành động để suy nghĩ về việc thêm lớp thứ hai vào phần tử đó và đặt kiểu cho nó.

html

<div class="container-fluid maxWidth"></div> 

css

.maxWidth { 
     max-width:1170px; 
} 

Nếu bạn đang muốn container được cố định không có vấn đề gì, mà sẽ làm cho các nội dung bên trong không đáp ứng khi họ sẽ không có thể cho biết khi màn hình đã thay đổi kích thước vì vùng chứa sẽ không thay đổi kích thước.

Các vấn đề liên quan