2014-05-10 9 views
12

Questa può sembrare una domanda stupida, ma esiste un riferimento ufficiale alla classe bootstrap? Ho consultato il sito Web e non sono riuscito a trovarne uno.Bootstrap: riferimento classe

Sto cercando anche se alcuni degli esempi e farò vedere cose del genere:

<div class="container-fluid"> 

Come faccio a capire che cosa tutto il tag contain-fluid fa? Mi aspettavo di scavare attraverso il css per ogni classe per guardare le regole e quindi divino su come influenzerà la mia pagina? Sembra un modo rapido per formulare ipotesi e incontrare problemi in seguito.

C'è un riferimento ufficiale da qualche parte che mi manca? Ho visto alcune liste di classi compilate da terze parti, ma sembra che queste rimarranno sempre indietro rispetto ai nuovi cambiamenti e potrebbero contenere ipotesi di intensità.

+0

non completamente sicuro di quello che stai chiedendo, ma se stai cercando una spiegazione su quali parti differenti dello stile di bootstrap controlla gli esempi sul loro sito qui. http://getbootstrap.com/ –

+1

l'aggiunta di liquido in un contenitore renderà la sezione divisa in 12 pezzi, indipendentemente da quanto sia grande. quindi se si dispone di un contenitore standard con una sezione di espansione 6 e quindi all'interno di un contenitore di fluido, dovrebbe rendere le 6 sezioni in 12. modo pratico per mantenere il formato della griglia e aumentare la precisione. –

+1

Informazioni sul fluido: RTFM http://getbootstrap.com/2.3.2/scaffolding.html # fluidGridSystem per BT2 o http://getbootstrap.com/css/#grid per BT3 – pbenard

risposta

0

Bootstrap 3 trasferito su un approccio "mobile first". .container è davvero solo lì nei casi in cui è necessario/desidera un layout a scatola. ma, se esenti interamente da div.container-fluid, per impostazione predefinita ti rimane un layout fluido.

per esempio, di avere un layout fluido a due colonne, è sufficiente utilizzare:

<body> 
<header>...</header> 
<div style="padding:0 15px;"><!-- offset row negative padding --> 
<div class="row"> 
    <div class="col-md-6">50%</div> 
    <div class="col-md-6">50%</div> 
</div> 
</div> 
<footer>...</footer> 
</body> 

Il .container-fluido 2.x è stato sostituito da .container in Bootstrap 3.x (http://getbootstrap.com/getting-started/#migration), quindi la .container è fluido, ma non è a tutta larghezza.

È possibile utilizzare la riga come contenitore di liquidi, ma è necessario modificarla leggermente per evitare una barra di scorrimento orizzontale. Estratto dai documenti (http://getbootstrap.com/css/#grid) ..

"Gli utenti che desiderano creare layout completamente fluidi (ovvero il sito estende l'intera larghezza del viewport) devono racchiudere il contenuto della griglia in un elemento contenente con padding: 0 15px; il margine: 0 -15px; usato su .rows. "

Altro sulle variazioni 3.x: http://bootply.com/bootstrap-3-migration-guide

Demo: http://bootply.com/91948

aggiornamento per Bootstrap 3.1

contenitore del liquido è tornato di nuovo in Bootstrap 3.1. Ora container-fluid può essere utilizzato per creare un layout a larghezza intera: http://www.bootply.com/116382

Problemi correlati