Articoli marcati con tag ‘Web Design’

« Vecchi articoli
Nuovi articoli »

text-shadow per aggiungere ombre al testo

14 agosto, 2010

CSS3 elimina la necessità di utilizzare Photoshop per aggiungere semplici ombre al testo.
La proprietà text-shadow si utilizza in questo modo:

text-shadow: 2px 2px 2px #000;

Con questo risultato:

Chi utilizza Safari 3+, Google Crome, Opera 9.5, Firefox 3.1(pre-Alpha), Konqueror o iCab dovrebbe vedere un’ombra grigia intorno a questo testo.

(continua…)

Tag:, ,
Pubblicato in CSS, Web Design | 2 Commenti »

CSS3 Opacity

14 agosto, 2010

Opacity rappresenta una delle funzioni CSS3 maggiormente implementate.
Ecco un esempio:

(continua…)

Tag:, ,
Pubblicato in CSS, Web Design | Nessun commento »

Colori HSLA

14 agosto, 2010

HSLA permette di aggiungere un quarto valore ad i colori HSL, che definisce l’opacità del colore.
Ecco un esempio:

Ed il CSS utilizzato nel primo caso è:

background-color: hsla(0,100%,50%,0.2);
background-color: hsla(0,100%,50%,0.4);
background-color: hsla(0,100%,50%,0.6);
background-color: hsla(0,100%,50%,0.8);
background-color: hsla(0,100%,50%,1);

Mentre nel secondo caso lo stesso risultato è ottenuto con valori RGB:

background-color: rgb(243,191,189);
background-color: rgb(246,143,142);
background-color: rgb(249,95,94);
background-color: rgb(252,47,47);
background-color: rgb(255,0,0);

Tag:, ,
Pubblicato in CSS, Web Design | Nessun commento »

Color HSL

14 agosto, 2010

CSS3 permette di utilizzare, oltre a valori di colore RGB ed esadecimali, anche valori HSL (Hue, Saturation, Lightness).
I tre valori da specificare sono:

  1. Hue: rappresenta il grado della scala di colore: 0 (0 360) rapprsenta il rosso, 120 il verde, 240 il blu. Valori intermedi indicano le diverse tonalità di questi tre colori.
  2. Saturation: è un valore espresso in percentuale: 100%; è il colore pieno.
  3. Lightness: è anch’esso un valore percentuale: 0% rappresenta il valore più scuro (nero), 100% il più chiaro (bianco) e 50% il valore medio.

HSL fornisce, quindi, un ampio spettro di colori e sfumature disponibili.
Attualmente questa proprietà è supportata da Opera 9.5, Safari 3, Google Chrome e Firefox.
Ecco un esempio:

Ed il CSS utilizzato nel primo caso è:

background-color: hsl(0,100%, 50%);
background-color: hsl(120,100%, 50%);
background-color: hsl(240,100%, 50%);

Mentre nel secondo caso lo stesso risultato è ottenuto con valori RGB:

background-color: rgb(255,0,0);
background-color: rgb(0,255,0);
background-color: rgb(0,0,255);

(continua…)

Tag:, , ,
Pubblicato in CSS, Web Design | Nessun commento »

« Vecchi articoli
Nuovi articoli »