Articoli marcati con tag ‘background-origin’

CSS3 Showcase

CSS3 Showcase
Negli articoli precedenti (e continueremo di tanto in tanto nei successivi) sono state esposte alcune delle funzionalità CSS3 che consideriamo veramente interessanti. Lo scopo di questo articolo è quello di raccogliere i vari argomenti trattati in una sorta di indice, in continuo aggiornamento, che permetta una facile consultazione dei contenuti trattati… un articolo da aggiungere ai preferiti! ;)
(continua…)

CSS3: background-origin e background-clip

Mozilla, Safari 3, Opera 10.5 e Google Chrome hanno implementato le nuove funzionalità background-origin e background-clip.

background-origin

La proprietà background-origin è utilizzata per determinare in che modo viene calcolata la background-position di uno sfondo in un contenitore.
background-origin accetta tre differnti valori: border-box, padding-box e content-box.
Specificando un valore di padding-box, la posizione si riferisce all’angolo sinistro superiore del contenitore; un valore di border-box fa riferimento all’angolo sinistro superiore del bordo; mentre content-box si riferisce all’angolo sinistro superiore del contenuto.

background-clip

La proprietà background-clip è utilizzata per determinare se lo sfondo si estende o meno nel bordo. Il valore di default è border-box, che indica che lo sfondo si estende nel bordo, ma specificando padding-box lo sfondo non riempie il bordo. Utilizzando content-box lo sfondo occuperà solo la porzione di spazio del contenuto (questo valore è stato rimosso dall’ultima versione delle specifiche).

(continua…)