All’interno di questa sezione è possibile gestire la proprietà box-shadow mediante la quale poter applicare un’ombra ad un qualsiasi elemento.

Proprietà: box-shadow

CSS: 3.0

Descrizione: consente di applicare e gestire un’ombra ad un qualsiasi elemento

ATTENZIONE! Le specifiche CSS3 prevedono anche la possibilità di gestire delle ombre multiple con valori diversi per ciascun fattore, a partire dal colore.

Per alcuni esempi in merito all’utilizzo della proprietà box-shadow è possibile consultare il seguente link http://www.css3.info/preview/box-shadow

Per aggiungere un’ ombra ad un elemento è sufficiente cliccare sul pulsante “Aggiungi nuova Ombra Oggetto” presente nella parte alta di questa sezione

Per ciascun ombra è possibile impostare i seguenti elementi:

• Offset X: definisce lo spostamento dell’ombra in senso orizzontale. Valori positivi collocano l’ombra sul lato destro del box, valori negativi sul lato sinistro
• Offset Y: definisce lo spostamento dell’ombra in senso verticale. Valori positivi collocano l’ombra sul lato inferiore del box, valori negativi sul lato superiore
• Blur: definisce il livello di sfocatura dell’ombra. Più alto è questo valore più sfocata apparirà l’ombra
• Spread: definisce il livello di diffusione dell’ombra. Più i valori sono alti più l’ombra tenderà ad espandersi in tutte le direzioni. Nel caso in cui si utilizzino dei valori negativi l’ombra tenderà a contrarsi fino a scomparire del tutto
• Colore: permette di impostare il colore dell’ombra utilizzando la stessa tavolozza già esaminata per il colore del testo (per maggiori informazioni in merito si veda anche il precedente capitolo “Colore”)
• Type: permette di decidere se l’ombra dovrà essere applicata all’esterno (opzione Default) oppure all’interno (opzione Inset) del box

Anche in questo caso, nel momento in cui si dovesse decidere di applicare contemporaneamente due o più ombre ad un stesso elemento, sarà necessario considerare anche che ciascuna di esse verrà collocata su di un diverso livello e che il primo elemento della lista sarà quello più “vicino” all’utente (quello cioè in primo piano).

Anche in questo caso è possibile variare l’ordine di inserimento (e quindi di sovrapposizione) delle diverse ombreggiature, in un qualsiasi momento.