2013-09-23 25 views
9

Chcę tylko usunąć jedną rzecz. Jeśli używam "container-fluid" klasy, to znaczy, że nie może mieć coś takiego w bootstrap.css:Twitter Bootstrap "ciecz-pojemnik"

.container-fluid{ 
width: 1170px; 
} 

Próbowałem ustawić w pikselach i czuły charakter po prostu wyłączony. Podczas ustawiania w% działa. Innymi słowy, moje pytanie brzmi tak: Jak ustawić stałą szerokość płynu w pojemniku? A może po prostu nie było to przeznaczone domyślnie przez programistów bootstrap?

ja już przeczytać ten link: Fluid or fixed grid system, in responsive design, based on Twitter Bootstrap

Ale po prostu nie mogę znaleźć nic tam dotyczącą responsive naturę i stałej szerokości container-fluid.

+0

Szybkość reakcji oznacza, że ​​szerokość ma być zależna od rozmiaru widocznego obszaru. Podawanie szerokości w procentach również nie jest poprawne, ponieważ w jakiś sposób zniekształci się na niektórych urządzeniach, dlatego lepiej użyć tutaj maksymalnej szerokości. – Amit

Odpowiedz

18

ustawienie px szerokość jest zarówno statyczne, trzeba by zatrudnić inną technikę, która sprawi, że będzie reagować po tym, jak np. javascript, dlatego użyto%.

Jeśli chcą, aby pojemnik nie iść szerszy niż 1170px użycie

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

max-width zrobi to tak, jeśli ekran użytkownicy jest szerszy niż 1170px pojemnik trafi tylko do 1170px szerokości. Dzięki temu mechanizmy reagujące będą działać.

Oczywiście użycie .container-fluid jako selektora zmieni sposób działania wszystkich elementów container-fluid, więc pomyśl o dodaniu drugiej klasy do tego elementu i ustawieniu stylu.

html

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

css

.maxWidth { 
     max-width:1170px; 
} 

Jeśli chcą pojemnik, który zostanie ustalony nie wiem co, że uczyni zawartość wewnątrz nie reagują, ponieważ nie będzie w stanie powiedzieć kiedy ekran zmienił rozmiar, ponieważ pojemnik nie zmieniłby rozmiaru.