- 28 Ottobre 2010
- 298
- 0
- Miglior risposta
- 0
Bootstrap è un framework realizzato e distribuito nel 2011 da Twitter. Bootstrap contiene una vasta gamma di strumenti che aiutano a creare siti mobile-friendly e graficamente appetibili in un modo talmente semplice che anche un bambino potrebbe riuscirci.
Prima di iniziare, devo precisare che per questa serie di guide ci sarà una relativa video-guida(Ed io sono un tipo abbastanza timido su queste cose), quindi scusatemi se sarò prorompente in alcuni punti.
Comunque, andiamo al sodo:
Per creare un sito con Bootstrap, necessitiamo di includere lo stesso.
In questo caso, però, la libreria JS di Bootstrap richiede jQuery: Per scaricarlo, andate
Una volta scaricato jQuery, scarichiamo anche Bootstrap:
Ora è il momento di includerli nel file HTML.
Cominciamo creare il solito template:
E poi includiamoci il framework:
A questo punto, Bootstrap sarà completamente integrato nel sito. Quindi, vediamo la prima componente del pacchetto all-in-one: la Navbar.
La Navbar serve per fornire all'utente finale un accesso a tutte le aree del sito in modo molto user-friendly. Quindi senza indugiare, andiamo direttamente al codice(Lo commenterò direttamente, ma comunque l'intera spiegazione è nel video):
Importante: Tramite la classe e il data-toggle settati su collapse facciamo in modo che, quando la navbar riconosce che si sta navigando su un dispositivo mobile che abbia una risoluzione bassa, il menù viene nascosto all'interno di un dropdown che verrà aperto con questo bottone.
Con questo finisce la prima guida, di seguito posto il video così chi vuole vedere come crearlo passo passo utilizzerà il video su Youtube.
Beh che dire, mi dispiace per tutte le figure di merda nel video ahahahahaha
Prima di iniziare, devo precisare che per questa serie di guide ci sarà una relativa video-guida(Ed io sono un tipo abbastanza timido su queste cose), quindi scusatemi se sarò prorompente in alcuni punti.
Comunque, andiamo al sodo:
Per creare un sito con Bootstrap, necessitiamo di includere lo stesso.
In questo caso, però, la libreria JS di Bootstrap richiede jQuery: Per scaricarlo, andate
Perfavore,
Entra
oppure
Registrati
per vedere i Link!
.Una volta scaricato jQuery, scarichiamo anche Bootstrap:
Perfavore,
Entra
oppure
Registrati
per vedere i Link!
.Ora è il momento di includerli nel file HTML.
Cominciamo creare il solito template:
HTML:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
HTML:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
A questo punto, Bootstrap sarà completamente integrato nel sito. Quindi, vediamo la prima componente del pacchetto all-in-one: la Navbar.
La Navbar serve per fornire all'utente finale un accesso a tutte le aree del sito in modo molto user-friendly. Quindi senza indugiare, andiamo direttamente al codice(Lo commenterò direttamente, ma comunque l'intera spiegazione è nel video):
HTML:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Importante: Tramite la classe e il data-toggle settati su collapse facciamo in modo che, quando la navbar riconosce che si sta navigando su un dispositivo mobile che abbia una risoluzione bassa, il menù viene nascosto all'interno di un dropdown che verrà aperto con questo bottone.
Con questo finisce la prima guida, di seguito posto il video così chi vuole vedere come crearlo passo passo utilizzerà il video su Youtube.
Beh che dire, mi dispiace per tutte le figure di merda nel video ahahahahaha
Perfavore,
Entra
oppure
Registrati
per vedere i Link!
Ultima modifica:
