Pure CSS una libreria per il responsive design

 

Pure CSS di Yahoo è una libreria open source minimale per creare siti responsive.

Introduzione

Il termine responsive design indica un approccio alla progettazione di una interfaccia web in modo che si adatta al device sulla quale viene visualizzata.
Nello sviluppo del progetto si devono tenere conto vari fattori quali le dimensioni dello schermo, la piattaforma di visualizzazione e l’orientamento del device.

Pure.CSS è un framework CSS che si caratterizza  per le sue dimensioni contenute.

Con PureCSS puoi creare interfacce ottimizzate per il mobile.

Ecco un riepilogo delle sue funzionalità:

• Creazione di layout responsive che si adattano ad ogni dispositivo;
• Personalizzazione forms;
• Griglie personalizzate e reattive;
• Menu verticali e orizzontali integrati, inclusi i menu a discesa;
• Bottoni;
• Tabelle;

La librerie è compatibile con il browser Internet Explore 8 +, Firefox, Chrome, Safari, Edge, iOS 6-8 e Android 4.x.

In questa pagina sono presenti degli esempi di layout per web site.

PureCSS è basato su Normalize.css, uno script che normalizza la visualizzazione dei selettori CSS indipendentemente dal browser utilizzato.

 

Installazione

Come si usa Pure.CSS.

Tra i tag <HEAD> e </HEAD> del tuo sito o tema devi inserire la seguente stringa che richiama il codice CSS da includere:

<link rel="stylesheet" href="https://unpkg.com/purecss@2.1.0/build/pure-min.css" integrity="sha384-yHIFVG6ClnONEA5yB5DJXfW2/KC173DIQrYoZMEtBvGzmf0PKiGyNEqe9N6BNDBH" crossorigin="anonymous">

Dopodiché puoi richiamare nel tuo codice la classe per il layout desiderato.

Per esempio per visualizzare un Pure Button devi inserire il codice:

<a class="pure-button" href="#">A Pure Button</a>
<button class="pure-button">A Pure Button</button>

 

Pro!
• Libreria leggera e ben documentata;
• Facile da personalizzare;
Ha un aspetto estremamente minimalista;
• Compatibilità con i principali browser;
• Lavora bene con Bootstrap.

Contro!
• Non per principianti;
• Ultima versione del 2013.

 

Link: PureCss.io

 

In conclusione

Una valida alternativa a Bootstrap per siti minimalisti e leggeri.

 

Per approfondire

Pure.css Offers an Intriguing Alternative to Bootstrap (tutsplus.com)

 

[wp_show_posts id=”607″]