1. casa
  2. Domanda e risposta
  3. Contenitori Bootstrap multipli e/o nidificati?

Contenitori Bootstrap multipli e/o nidificati?

2014-10-20 13 views
61

Il mio comprensione è che tutti gli elementi in stile Bootstrap devono esistere all'interno di un elemento <div class="container">. Ma a volte vedo esempi Bootstrap dove ci sono più "contenitori":Contenitori Bootstrap multipli e/o nidificati?

<div class="container"> 
    <!-- Blah, GUI stuff, blah --> 
</div> 

... 

<div class="container"> 
    <!-- Blah, more GUI stuff, blah --> 
</div>

Le mie domande:

  1. Quando vuole mai bisogno di una singola pagina HTML con più "div contenitore"? Quale vantaggio offre questa offerta anziché mettere semplicemente tutto il corpo in un grande "contenitore div"?
  2. Vuoi mai annidare i "contenitori div" all'interno di altri? Quando perché?

fonte

2014-10-20 smeeb

+1

Se si utilizza un carosello di grande ampiezza ha contenitori utilizzati per le didascalie in modo che non dovrebbe essere in un contenitore. Per questo potresti avere un contenitore sopra di esso e un contenitore sotto di esso. – Aibrean

+1

Mentre @Christina è corretto in quanto i documenti dicono che non si annidano contenitori, a volte è usato e utile. Vedi http://stackoverflow.com/questions/29660034/nesting-a-container-class-inside-a-container-fluid-class-in-bootstrap-3 per ulteriori informazioni sulla nidificazione. – gidmanma

risposta

67

  1. Alcune sezioni della pagina si estenderà per l'intera larghezza della vista e altri no. Alcuni sfondi avranno l'intera larghezza ma il contenuto no.

    Un esempio di questa è un'area di featurette che ha un'immagine di sfondo o un colore che è l'intera larghezza del viewport ma il contenuto al suo interno, i moduli o qualsiasi altra cosa, non supera lo .container a qualsiasi larghezza di finestra specificata.

  2. Non nidificare .container o .container-fluid - vedere docs. Non è necessario.

    Documenti: Bootstrap richiede un elemento contenitore per avvolgere il contenuto del sito e ospitare il nostro sistema di rete. Puoi scegliere uno dei due contenitori per utilizzare nei tuoi progetti. Si noti che, a causa del riempimento e altro, né il contenitore è nidificabile [non significa che. Container e .container-fluid NON siano nidificati].

fonte

2014-10-20 15:31:35 Christina

+1

Spesso ho un '.container-fluid' per qualcosa come la barra di navigazione o il banner di qualche tipo mentre il sito principale si trova all'interno di un' .container'. – DavidG

+2

@DavidG Sì, quindi il doppio riempimento.Documenti: Bootstrap richiede un elemento contenente per avvolgere il contenuto del sito e ospitare il nostro sistema di rete. Puoi scegliere uno dei due contenitori da utilizzare nei tuoi progetti. Si noti che, a causa del riempimento e di altro, nessuno dei due contenitori può essere nidificato. http://getbootstrap.com/css/ – Christina

+0

Ovviamente non intendo nidificato. – DavidG

4

In realtà la sua totalmente dipende il requisito del progettista.

Alcune volte è necessario larghezza della fila (intendo dire finestra o una striscia di parte visibile che è possibile realizzare senza classe contenitore separato)

http://binarytheme.com/demos?theme=bootsrap-landing-page-blue

vedi sopra esempio template di comprendere

fonte

2014-10-21 08:37:09 test

Problemi correlati

 Problemi correlati