HTML and CSS Reference
In-Depth Information
</div>
</div>
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button type="submit" class="btn btn-default">Sign
in</button>
</div>
</div>
</form>
Il primo passo consiste nell'aggiungere la classe CSS
form-horizontal
al tag
form
.
Poi, all'interno di ogni gruppo, racchiudiamo il tag
input
in un tag
div
. Infine, ai tag
label
e
div
assegniamo le classi
col-*
(che possono essere utilizzate anche se non so-
no contenute in un div con classe
row
) per impostare quante colonne virtuali occupano.
nota
La classe
col-lg-offset-*
specifica il numero di colonne virtuali da lascia-
re vuote.
Una volta appreso come creare layout e form, abbiamo già compreso gran parte del poten-
ziale di Bootstrap.
Tuttavia rimangono alcune funzionalità, che possiamo comunque menzionare anche se
non possiamo approfondirle, per ovvi motivi di spazio.
Bootstrap mette a disposizione molte classi per la cosiddetta
tipografia
. Abbiamo classi
per impostare l'orientamento del testo, per trasformare il case del testo, per le immagini
responsive, per colorare bottoni, per dare evidenza a dei
div
, per creare progress bar e per
creare badge. Inoltre, alcuni oggetti sono già stilizzati di default come le intestazioni, i mo-
dificatori di stile del testo, i paragrafi, le liste, le tabelle e molto altro ancora.
Non solo, Bootstrap mette a disposizione anche 260 icone in formato font dalla libreria
Glyphicon Halflings. Queste icone coprono le esigenze più comuni sul Web e sono di-
sponibili tramite classi CSS apposite. Alcuni esempi sono le classi
glyphicon-plus