Flex
Cristina Flex o flexbox CSS, come spiegato nella precedente lezione consente di creare layout molto più semplici da gestire grazie alle proprietà che si possono assegnare. Analizziamo in dettaglio queste proprietà.…
CSS
Menù responsive
In questa lezione realizzeremo un menù responsive utilizzando html5 e css3. In particolare ad una risoluzione minore o uguale di 768 pixel si vedrà quello che spesso viene definitivo humburger…
Opacity
La proprietà opacity nei CSS specifica la trasparenza di un elemento. Questa proprietà può assumere un valore tra 0,0 e 1,0, estremi inclusi. Più basso è il valore e più…
CSS media query
In questa lezione parleremo dei CSS ed in particolare delle media query attraverso alcuni esempi pratici, utili per capirne bene il funzionamento. Ricordiamo che la media query è una tecnica…
Icons CSS
In questa lezione vedremo come aggiungere le icons CSS nei nostri siti web e dare anche una formattazione opportuna con i fogli di stile. Ci sono vari metodi per inserire…
Float e clear
Oggi parleremo di float e clear nei CSS e faremo degli esempi su come utilizzare assieme queste due proprietà. Esempi d’uso float e clear Facciamo un esempio in riferimento all’esempio…
Layout con float
In questa lezione creiamo un layout utilizzando i float in modo da comprenderne meglio il funzionamento. Fino a qualche anno fa i layout con i float erano ampiamente utilizzati e…
before e after CSS
In questa lezione studieremo gli pseudo-elementi before e after dei CSS, utilizzati per aggiungere elementi che non sono presenti nel codice html. In dettaglio before inserisce un contenuto prima dell’elemento…
Float CSS
In questa lezione studieremo la proprietà float dei CSS. Questa proprietà consente di rimuovere un elemento dal suo normale flusso e quindi di poterlo spostare a destra oppure a sinistra.…
Position sticky
Il position sticky nei CSS consente di posizionare l’elemento secondo il normale flusso del documento (a differenza di fixed), quando poi scorriamo la pagina, la sua posizione rimane fissa rispetto…
Opacità con rgba
In questo articolo vedremo come creare un’opacità con rgba. Abbiamo già visto, nella lezione precedente, come utilizzare opacity. Abbiamo anche notato che l’effetto opacità, oltre allo sfondo, viene applicato anche…
Media queries
Le media queries CSS sono delle regole di stile che permettono di adattare i siti web ai diversi dispositivi, dai desktop ai mobile. Quindi ad esempio si possono impostare delle…
Text shadow
In questa lezione vedremo come utilizzare la proprietà text shadow dei CSS, utile per dare un effetto ombra ad un testo. Esempi pratici Text shadow Vediamo dunque degli esempi pratici…
First child
In questa lezione studieremo come utilizzare first child nei CSS. In particolare possiamo definire la pseudo classe first child come il primo elemento di ciascun gruppo di elementi. First child…
First letter e first line
In questa lezione vedremo come utilizzare gli pseudo-elementi first letter e first line. Questi pseudo-elementi nei CSS si utilizzano per stilizzare la prima lettera di una determinata frase oppure un’intera…
Tutorial CSS
In questo semplice tutorial sui CSS (Cascading Style Sheets), impareremo ad utilizzare i fogli di stile per dare una piacevole formattazione ad una pagina web. Le regole per creare i…
Order
La proprietà order permette di decidere l’ordine di allineamento degli elementi, cioè l’ordine in cui viene mostrato un box contenitore rispetto agli altri definiti nello stesso contenitore padre. Order possibili…
Align self
La proprietà align self consente di specificare per un singolo box l’allineamento sull’asse perpendicolare, cioè sull’asse y. In definitiva questa proprietà sostituisce l’allineamento impostato dalla proprietà align-items impostato nel contenitore…