Sei snippet di Bootstrap che potrebbero esserti utili

Argomenti:
Pubblicato il: 08-05-2020 08:01 , Ultimo aggiornamento: 20-04-2021 14:43

In questo articolo ho raccolto un po’ di snippet e frammenti di codice in Bootstrap, il framework open source in CSS/HTML per implementare interfaccie frontend e backend che siano già responsive, che potrete riutilizzare nei vostri progetti. I link sono descritti uno per volta e contengono sia CSS che HTML (in alcuni casi PHP) da utilizzare volta per volta.

SMSHosting Usa il codice PROMO per uno sconto sul primo acquisto: PRT96919

Grid con colonne dispari

Se dovete dividere la grid di Bootstrap in 2, 4, 6 colonne (o in genere un numero pari) potrete cavarvela sfruttando direttamente i markup stilizzati md o xs; ma se le colonne devono essere ad esempio 7 oppure 9, equidistanti tra loro e senza offset, le cose possono diventare leggermente più complesse. Su StackOverflow al link suggerito si discutono due possibili soluzioni al problema.

Generatore di gradiente per bottoni

Stilizzare in CSS i bottoni di Bootstrap, che possono essere link href come <button> indifferentemente, non è un’operazione per principianti: certamente charliepark rende il tutto più semplice e vagamente alla portata degli sviluppatori con minore esperienza. Un tool utile e pratico, da tenere sempre a portata di click.

Scroll infinito sulle pagine

Una delle caratteristiche più sfruttate sui siti web realizzati di recente: evita di fatto il click sulla paginazione, e la rende del tutto asincrona con un “pezzo” di pagina alla volta che carica. Esempio classico: il wall di Facebook, che segue questo meccanismo per almeno un motivo preciso (la permanenza sulla pagina aumenta di parecchio, e l’utente ha l’illusione che i contenuti del sito “non finiscano mai”). Ottimo per i blog con numerosi contenuti, vale per Boostrap ma anche per altri framework, e la spiegazione su come realizzarlo è piuttosto chiara: la trovate su tutsplus.

Template già pronti riutilizzabili in Bootstrap

A questo indirizzo trovate vari esempi di form in Bootstrap utilizzabili in vari contesti: theme per web agency, creativi/freelance, blog, landing page, backend amministrativi e molto altro ancora.

Creare una finestra modale di caricamento

Una delle caratteristiche più richieste per Bootstrap: un esempio significativo per la versione 3 è disponibile qui.

Listino prezzi pre stilizzati

Le pricing table per Bootstrap sono esemplificate a questo indirizzo di bootsnipp, ma ne ho parlato un po’ più estesamente anche nel mio precedente post.

Nessun voto disponibile

Che te ne pare?

Grazie per aver letto Sei snippet di Bootstrap che potrebbero esserti utili di Salvatore Capolupo su Trovalost.it
Sei snippet di Bootstrap che potrebbero esserti utili (Guide, Assistenza Tecnica)

Articoli più letti su questi argomenti:

Seguici su Telegram: @trovalost