3 fantastici CSS Framework da non perdere
Personalmente, preferisco iniziare a programmare qualsiasi progetto con solo una griglia e costruire da lì. Sono pignolo in questo modo e mi piace avere il controllo su quante più variabili possibili.
Ci sono momenti, tuttavia, quando questo non è pratico. Forse stai costruendo un'app o un sito eccezionalmente grande e complicato. Forse non hai il tempo di stilare ogni singolo elemento da zero, e non ne hai bisogno. Questo è quando vuoi un quadro completo, con extra.
Beh, molto è stato scritto sul framework dei "grandi nomi": Bootstrap, Foundation, Gumby, quindi non parleremo di quelli qui. Ho giocato wi ... Voglio dire testare rigorosamente tre delle opzioni meno conosciute. Date un'occhiata, uno di questi potrebbe essere esattamente ciò di cui avete bisogno.
Kube
Kube è sicuramente uno strumento per il moderno sviluppatore front-end. Solo i browser moderni e IE9 + sono supportati. Gli stili di default sono carini, ma abbastanza blandi da essere adattati per l'uso con quasi tutti i marchi.
Si tratta, in breve, di una struttura di bell'aspetto ma semplice e semplice, progettata con un appeal visivo quasi universale e destinata a una forte personalizzazione.
Le caratteristiche
Per descrivere tutte le funzionalità in modo approfondito, o anche solo per elencarle tutte, probabilmente occuperemmo troppo spazio in questo articolo, quindi ti darò i punti salienti: il framework stesso è basato su LESS e modulare. Ad esempio, se si desidera tutto tranne gli stili dei pulsanti, è molto semplice "compilare" il proprio. Basta rimuovere la regola @import corrispondente da kube.less e andare. Si può affermare che esistono stili per quasi tutti gli elementi HTML che si possono immaginare, e i soliti extra come pulsanti, barre di navigazione di base, classi helper e un sistema di layout di griglia piuttosto solido.
In un certo senso, Kube è definito in parte da ciò che non ha. Ad esempio, non ha una sovrabbondanza di elementi dell'interfaccia utente e stili aggiuntivi. Non ci sono plugin jQuery per la funzionalità dell'interfaccia utente. E certamente non ha l'impressione di essere "bloccato" con nessuno di questi.
Conclusione
Kube è un'offerta solida. I suoi creatori non hanno lesinato sui fondamentali, ma c'è un preciso senso di "solo ciò di cui hai bisogno" che viene fornito con questo quadro. È un buon punto di partenza, e quindi incarna il vero scopo di qualsiasi struttura. Colpiscimi di me.
Quadro AVORIO
AVORIO, come Kube, è progettato per essere facilmente compreso e implementato rapidamente. La tipografia sembra buona, ma è abbastanza blanda da poter essere usata con quasi tutti i progetti, e lo sono anche gli stili generali di default.
È un framework progettato per darti quanto basta per iniziare e alcuni extra.
Le caratteristiche
Le funzionalità sono ciò che normalmente ti aspetti: un sistema di griglia solido e flessibile, stili per la tipografia e tutte le forme e così via. Tuttavia, IVORY differisce da Kube in quanto vengono forniti alcuni elementi aggiuntivi dell'interfaccia utente: pulsanti, caselle di avviso, impaginazione, interruttori a levetta, descrizioni comandi, navigazione breadcrumb, schede e fisarmoniche.
Ciò che distingue questi componenti UI da molti altri è che sono tutti implementati con CSS3 e senza JavaScript. L'unica ragione per cui l'interfaccia utente di jQuery è collegata a tutti è quella di far funzionare il selezionatore di date.
Solo due cose che non mi piacciono: alcuni degli stili dei componenti dell'interfaccia utente ricordano molto gli stili di Bootstrap 2.0. Quindi sì, probabilmente vorrai cambiarli. Inoltre, il sistema di griglia richiede l'uso di una classe extra sull'ultima colonna in qualsiasi riga; Lo odio .
Conclusione
A parte questi due piccoli avvertimenti, IVORY Framework è una buona opzione per qualsiasi numero di progetti. Non è la più facilmente personalizzabile delle opzioni, ma se hai solo bisogno di iniziare con un buon set di impostazioni predefinite e alcuni componenti aggiuntivi dell'interfaccia utente, fallo girare.
Base
Base, di Matthew Hartman , prende un approccio un po 'più trendy (al momento, in ogni caso) al framework CSS. Basato su Normalize.css , inizia con caratteri a direzione sottile e caselle piatte per pulsanti. Non si può negare che gli stili di default sono decisamente belli.
Questo potrebbe non essere gradito a tutti, a seconda delle preoccupazioni sul marchio, ma è abbastanza semplice da cambiare. Dopotutto, Base è interamente dedicato alla personalizzazione.
Le caratteristiche
Base è disponibile sia nelle versioni LESS che SASS, quindi puoi modificare rapidamente le variabili e "ricompilarle" in base alle tue esigenze. Le variabili integrate includono le dimensioni dei caratteri, i punti di interruzione, le larghezze dei contenitori principali per ogni punto di interruzione e altro ancora.
Sono fornite molte lezioni extra per aiutarti a configurare i tuoi layout specifici per i dispositivi mobili, e ci sono "mixin" in un file separato per aiutarti nella tua strada.
Come Kube, non ci sono componenti UI extra oltre a quelli forniti con HTML di default, quindi se vuoi interfacce a schede, fisarmoniche e simili, dovrai farlo tu stesso. Base sembra essere orientata verso la realizzazione di bellissimi siti web invece di app web .
Conclusione
Se stai costruendo un sito che non ha bisogno di troppi componenti dell'interfaccia utente specifici dell'app, allora Base è una risorsa fantastica. Le pagine create con esso sono già belle; ma se non ti piacciono gli stili di default, non è troppo difficile cambiarli.
