SPAGHETTIWEB

Creare un box sfumato con i css

Ormai con i css si riesce a fare veramente di tutto.

Box con angoli arrotontati, dal background sfumato, ombreggiati.

Se solo penso alle prime volte che mi trovavo a creare questi oggetti in html ben oltre 10 anni fa, c’erano tabelle da fare, ritagliare immagini dagli angoli stondati, in gif trasparente… un bel lavoraccio che faceva perdere un sacco di tempo.

Segnalo questo utile sito dove poter personalizzare i colori della sfumatura che vogliamo ottenere tramite un tool visuale, ottenuto il risultato desiderato, basta copiare il codice Webkit e Firefox nel nostro css.
Tool per la sfumatura lineare

Tool per la sfumatura radiale

Tool che controlla le varie caratteristiche del box (bordi, ombra, colonne del testo)

Css3 – Personalizzazione del font e ombreggiatura

Una delle cose che mi sono piaciute di più nel nuovo standard CSS3 è la possibilità di utilizzare qualsiasi font vogliamo per i nostri testi, senza per forza dover ricorrere all’uso di immagini, con notevoli vantaggi anche da punto di vista dell’indicizzazione.

Il tag che andremo ad utilizzare è il “@font-face” per incorporare il font nel foglio di stile.

Per ottenere l’effetto ombreggiatura dovremmo usare invece il tag “text-shadow”.

Ecco la mini guida che ne spiega l’applicazione sia per l’embedding del font che per l’ombreggiatura.