3 de janeiro de 2012 CSS3

Propriedade background-clip

Entenda como a propriedade background-clip do CSS3 funciona.

A propriedade background-clip é muito simples de se entender. Até agora nós nunca tínhamos como controlar onde o background começaria a ser desenhado. Imagine que temos um elemento com um determinado padding e que você queira que o background, seja ele uma imagem ou uma cor, aparecesse somente onde está o conteúdo, ignorando a parte do padding.

O background-clip tem 4 valores: border-box, content-box, padding-box e text. O valor text foi inserido pelo pessoal do Webkit em 2008 e dave ser incluída no padrões em algum momento por conta da sua utilidade!

Este exemplo de como funciona a propriedade dispensa maiores explicações.

Aqui tem a documentação oficial.

http://twitter.com03APR91/ 03APR91

Background no texto, que bacana!
http://www.clearingsigner.com Rafael Silva

Muito simples a explicação e bastante clara!
http://www.clearingsigner.com Rafael Silva

Muito simples a explicação e bastante clara!
http://www.clearingsigner.com Rafael Silva

Muito simples a explicação e bastante clara!
http://neuroniodigital.com.br Adriano Ribeiro

Uma demonstração bem legal do que é possível fazer com background-clip http://tympanus.net/Tutorials/ExperimentsBackgroundClipText/
http://twitter.com/felipiexe Felipë Gonçalves

Muito bom ! Excelente!
Matheus Salmi

Background no texto é, sem dúvida, muito interessante!
Kevingarciafernandes

Penis
Adm_fael_hs

Só o texto que é meio…
http://www.facebook.com/KvnAllen Kevin Allen

Show!
GuilhermeAmarino

no texto é bem interessante, dá pra deixar visuais bem bacanas nas fontes usando a propriedade texto.
http://www.facebook.com/sergiofreelati Sérgio Henrique

Queria saber da compatibilidade.. como funciona nesses termos?

Tableless

Propriedade background-clip

Mais artigos