A prima vista sembra particolarmente complesso riuscire a trasformare un’ombra realizzata con Photoshop nella relativa versione in CSS tramite la proprietà box-shadows e, effettivamente, senza fare un po’ di calcoli lo è: non esiste una corrispondenza diretta tra i valori utilizzati in PS e quelli nei CSS.
box-shadow
Creare un’ombra interna solo su un lato (box-shadow inset)
Con la versione 3 dei CSS sono state introdotte alcune novità interessantissime e una di queste è senza alcun dubbio la possibilità di creare ombre per i box (es. div) senza dover ricorrere a bizantini puzzle di immagini PNG.
L’utilizzo però della proprietà box-shadow non è subito immediato e ci impone di effettuare diversi tentativi prima di acquisire una certa dimestichezza.
Forse uno dei suoi utilizzi meno immediati è quello che riguarda le ombre inset solo su un lato del nostro box, ad esempio per creare un’ombra sotto la testata o su un lato di una colonna o del menù di navigazione.
Appunti di Web 