Contenitori box di bootstrap

Twitter Bootstrap Scaffolding nella sezione Layout fluido mostra un codice di esempio che viene visualizzato come due riquadri blu. Usando questo esempio, il codice sotto, mostra "Contenuto del contenuto della barra laterale" ma non caselle. Cos'altro è necessario?Contenitori box di bootstrap

<!DOCTYPE html> 
<html> 
<head> 
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-iconhttp://twitter.github.io/bootstrap/scaffolding.htmls.min.css" rel="stylesheet"> 
</head> 
<body> 
<div class="container-fluid"> 
    <div class="row-fluid"> 
    <div class="span2"> 
     Sidebar content 
    </div> 
    <div class="span10"> 
     Body content 
    </div> 
    </div> 
</div> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script> 
</body> 
</html>

fonte

2013-07-20 C.W.Holeman II

Se stai cercando di vedere le caselle blu quelli sono solo visualizzati lì per riferimento e sottolineare come la griglia è suddivisa. In realtà non sono pensati per essere inclusi nel codice. Le parole Sidebar Content e Body Content sono i tuoi punti di riferimento per la visualizzazione dei contenuti. Per ottenere un po 'di ombreggiatura dovrai aggiungere una classe CSS accanto alle tue divs span2 e span10. Ecco un esempio:

<div class="span2 well"> 
    Sidebar content 
</div>

fonte

2013-07-20 22:57:24

Il Bootstrap documenti hanno una proprietà di stile aggiuntivo show-grid che viene utilizzato per visualizzare uno sfondo (scatole) sulle span* (colonne) all'interno di righe. Il CSS è simile al seguente:

.show-grid [class*="span"] { 
    background-color: #ddd; 
}

e viene applicata alle righe nei documenti come questo ..

<div class="row-fluid show-grid"> 
    <div class="span2"> 
     Sidebar content 
    </div> 
    <div class="span10"> 
     Body content 
    </div> 
</div>

Demo: http://www.bootply.com/68856

fonte

2013-07-21 10:35:19 ZimSystem

Contenitori box di bootstrap

risposta

Problemi correlati