Corsi on-line

Guida Bootstrap

Una guida completa ed esaustiva all'utilizzo della libreria Bootstrap grazie alla quale potremo creare facilmente siti web sfruttando le potenzialità di HTML5 e del responsive design
  • CommentiScrivi un commento
  • ForumDiscuti sul forum
  • Introduzione a Bootstrap

    Lezione 1 - Premessa: questa guida si basa sulla versione 3 di Bootstrap rilasciata nell'Agosto del 2013. Se state utilizzando una versione precedente del fram...

    10.050 lettori
  • Iniziare con Bootstrap: la struttura della pagina

    Lezione 2 - Procurarsi Bootstrap Procurarsi il framework Bootstrap è molto semplice. Basta visitare il sito getbootstrap.com e fare clic sul pulsante download...

    10.402 lettori
  • Compatibilità cross-browser e cross-devices: limiti e problemi di Bootstrap

    Lezione 3 - Nella prima lezione abbiamo avuto modo di raccontare i grandi vantaggi offerti da Bootstrap, ma è bene dedicare qualche riflessione anche al suppor...

    6.910 lettori
  • La griglia di Bootstrap

    Lezione 4 - Dopo aver parlato in generale di Bootstrap, delle sue potenzialità e del supporto offerto dai vari dispositivi, è giunto il momento di “mette...

    9.087 lettori
  • Immagini responsive con Bootstrap

    Lezione 5 - Nella scorsa lezione abbiamo già visto che le “celle” delle colonne del layout (creato con l'ausilio della "griglia" di Bootstrap) sono...

    7.644 lettori
  • La griglia: gestire l'offset

    Lezione 6 - Dopo la digressione della scorsa lezione sulle immagini responsive, torniamo a parlare della griglia di Bootstrap per la creazione dei layout, parl...

    8.212 lettori
  • La griglia: annidiare e riordinare le colonne

    Lezione 7 - Annidiare le colonne Bootstrap permette di annidare le colonne, cioè di inserire una nuova griglia all'interno di un'altra griglia. Per farlo è su...

    5.863 lettori
  • Le classi per le colonne e le diverse dimensioni della viewport

    Lezione 8 - Nelle lezioni precedenti abbiamo sempre creato le colonne utilizzando la classe .col-md-N., dove N è il numero delle colonne strutturali della grig...

    5.653 lettori
  • La barra di navigazione

    Lezione 9 - Uno degli elementi comuni a tutti i siti web è la barra di navigazione (o navbar). La navbar è l'elemento strutturale che contiene i link che conse...

    8.031 lettori
  • Perfezionare la barra di navigazione in Bootstrap

    Lezione 10 - Continuiamo quanto introdotto nella precedente lezione proseguendo nel parlare di barre di navigazione o navbar. Innanzi tutto diciamo che tutti gl...

    7.321 lettori
  • Disabilitare il layout responsivo

    Lezione 11 - Negli esempi che abbiamo proposto fin qui, abbiamo sempre utilizzato delle pagine responsive (o, in italiano, adattive) cioè pagine i cui elementi ...

    3.687 lettori
  • Creare un menu a discesa

    Lezione 12 - Nelle barre di navigazione possono essere inseriti elementi più complessi rispetto a dei semplici collegamenti. Uno degli elementi più comuni sono ...

    12.777 lettori
  • Gestire le thumbnail all'interno del Grid System

    Lezione 13 - Il grid system di Bootstrap di cui abbiamo parlato nelle lezioni iniziali del corso può essere espanso con l’uso del componente thumbnail che...

    3.135 lettori
  • I titoli delle pagine: page-header e jumbotron

    Lezione 14 - Per creare l'header delle pagine (intesa come area di intestazione visibile all'utente), Bootstrap dispone di una apposita classe, page-header, che...

    3.182 lettori
  • I pulsanti

    Lezione 15 - Nelle lezioni precedenti ci è capitato di utilizzare dei pulsanti. Ora è giunto il momento di trattarli in modo più approfondito e capire, in modo ...

    3.462 lettori
  • Creare pulsanti complessi

    Lezione 16 - Bootstrap permette di usare i pulsanti in situazioni più complesse di quelle viste nella lezione precedente, ad esempio è possibile creare gruppi d...

    3.072 lettori
  • Pulsanti per dropdown menu

    Lezione 17 - Abbiamo già avuto modo di parlare di elenchi a discesa, ma nella loro versione più semplice. Torniamo sull’argomento per aggiungere qualche u...

    2.767 lettori
  • Dinamizzare i pulsanti con Javascript

    Lezione 18 - Fino ad ora abbiamo disegnato dei pulsanti che non fanno nulla, ovviamente si è trattato solo di esempi scolastici in quanto, per definzione, un pu...

    2.724 lettori
  • Formattazione del testo

    Lezione 19 - Il testo del corpo della pagina, per impostazione predefinita, in Boostrap, è reso con dimensione (font-size) 14px e una interlinea (line-height) d...

    3.268 lettori
  • I gruppi di input

    Lezione 20 - Bootstrap permette in modo molto semplice di creare e formattare opportunamente gli input di testo, cioè i campi in cui l'utente può digitare del t...

    2.382 lettori
  • Le Labels (etichette)

    Lezione 21 - Bootstrap dispone di diverse classi per la formattazione delle etichette (o label). La classe label viene aggiunta ad elementi di testo inline per ...

    1.944 lettori
  • I Badges

    Lezione 22 - I badges sono piccoli elementi che possono essere posti accanto ad altri elementi per mettere in evidenza la presenza quacosa "di nuovo" come, ad e...

    1.911 lettori
  • Gestire la paginazione

    Lezione 23 - Bootstrap permette di creare facilmente elementi utili per la paginazione dei contenuti. Tutto questo grazie all'uso della classe pagination applic...

    2.195 lettori
  • Le progress bar (o barre di avanzamento)

    Lezione 24 - Un altro elemento facilmente realizzabile con Bootstrap è la barra di progressione (o barra di avanzamento). Nella sua forma più semplice, la barra...

    3.521 lettori
  • Alert ed Avvisi

    Lezione 25 - Bootstrap permette di generare in modo molto semplici delle finestre di messaggio (alert) da utilizzare per comunicare agi utenti delle informazion...

    2.592 lettori
  • I Popover

    Lezione 26 - Un popover è una sorta di fumetto con delle informazioni aggiuntive che compare vicino ad un elemento, quando si fa clic su di esso. Un popover v...

    2.756 lettori
  • Il plugin ScrollSpy

    Lezione 27 - Vediamo come utilizzare il plugin ScrollSpy di Bootstrap per realizzare single page website dal look moderno e con effetti di sicuro impatto visivo...

    2.683 lettori
  • Carousel

    Lezione 28 - Questo plugin Bootstrap permette di creare una sequenza di immagini o altri elementi a scorrimento. Definire la struttura del Carousel La realizz...

    4.791 lettori
  • Tabs e Pills

    Lezione 29 - La classe nav applicata alle liste le identifica come un insieme di collegamenti che consentono di "navigare" tra i contenuti. Nello specifico vedr...

    2.837 lettori
  • List Group

    Lezione 30 - La classe list-group permette di modificare l'aspetto delle liste in modo da mostrare i contenuti in maniera più efficiente. Nella sua forma base ...

    1.540 lettori
  • Accordion e Collapsible

    Lezione 31 - L'accordion è uno strumento utile per presentare una grande quantità di contenuto nelle pagine occupando poco spazio. Il contenuto, in pratica, vie...

    3.512 lettori
Corsi
Altre Guide