CSS3 - Border-radius / Cantos arredondados »

05dez 2009, às 08:08

Publicado em HTML / CSS | Deixe o seu comentário (1) »

publicado por: Magno Valdetaro

Com a CSS3 a W3C oferece algumas novas opções, das quais uma boa é a propriedade border-radius. O Mozilla Firefox e Safari 3+ já implementaram está função, que permite criar cantos arredondados: Veja um exemplo:

Apenas um simples exemplo

O código para este exemplo acima é bem simples:


Os cantos podem ser tratados de maneiras individuais e com formas diferente para os mozilla tem sua própria maneira de tratar está propriedade diferente do que é a especificação. No mozilla Firefox é tratado com -moz-border-radius-topright , já para os navegadores que utilizam o webkit como renderizador -webkit-border-top-right-radius:

Usuários do Mozilla/Firefox e Safari 3 poderão ver o canto superior esquerdo desta caixa arredondado.
Usuários do Mozilla/Firefox e Safari 3 poderão ver o canto inferior esquerdo desta caixa arredondado.
Usuários do Mozilla/Firefox e Safari 3 poderão ver o canto superior direito desta caixa arredondado.

Propriedades para cada canto no mozilla e webkit:

  • -moz-border-radius-topleft / -webkit-border-top-left-radius
  • -moz-border-radius-topright / -webkit-border-top-right-radius
  • -moz-border-radius-bottomleft / -webkit-border-bottom-left-radius
  • -moz-border-radius-bottomright / -webkit-border-bottom-right-radius

Compatibilidades da CSS com Internet Explorer 6, 7 e 8 »

13out 2009, às 08:51

Publicado em HTML / CSS Recursos | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

Conhecer a compatibilidade da CSS tornou-se uma tarefa muito importante hoje em dia para webdesigners e desenvolvedores. A cada nova versão do Internet Explorer (arrepios) o suporte a CSS tem melhorado.

Cheat Sheet para Webdesigners »

24set 2009, às 08:56

Publicado em Recursos | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

Posso afirmar que você não lembra de todos os atributos, classes, tags, funções e atalhos que todo desenvolvedor web precisa conhecer no dia a dia, certo ou errado?

É aí que entra uma Cheat Sheet, uma “colinha”, para te ajudar naquele momento em que a memória falhar (tá lembrando do colégio?). A Cheat Sheet é um documento que contém as informações mais básicas sobre um software, linguagem e por aí vai.

CSS3 Digest »

22set 2009, às 08:02

Publicado em HTML / CSS | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

css3