Bordas Arredondadas e
Sombreamento com CSS-3
CSS - Style Sheet
Professor: Jolvani
Aula 34
Bordas Arredondadas e Sombreamento CSS3
 O CSS usado até agora abrangem a versão 1 e 2, já existe a versão 3 mas não é
suportada por todos os browsers, somente alguns recursos.
 Criamos mais uma aula com uma página que contem uma div com id container e
queremos transforma-la num bloco.
Bordas Arredondadas e Sombreamento CSS3
 Criando nossa folha de estilo. “bordas.css”
 Até agora nenhuma novidade.
 Agora utilizando o recurso de arredondamento.
Bordas Arredondadas e Sombreamento CSS3
 Quanto maior for o numero para border-radius:30px maior será o
arredondamento.
 Adicionando o efeito sombra com box-shadow, podendo definir a propriedade da
sombra e sua cor mesmo que os editores de imagem usam.
 Abaixo nós vemos o formato da sombra suportado pelo Firefox 3.0
 Aquele usado acima é suportado pela versão 8.0 em diante.
Próxima Aula: Última Aula – Validação
na W3C por sua conta.

Aula 34. bordas arredondadas e sombreamento

  • 1.
    Bordas Arredondadas e Sombreamentocom CSS-3 CSS - Style Sheet Professor: Jolvani Aula 34
  • 2.
    Bordas Arredondadas eSombreamento CSS3  O CSS usado até agora abrangem a versão 1 e 2, já existe a versão 3 mas não é suportada por todos os browsers, somente alguns recursos.  Criamos mais uma aula com uma página que contem uma div com id container e queremos transforma-la num bloco.
  • 3.
    Bordas Arredondadas eSombreamento CSS3  Criando nossa folha de estilo. “bordas.css”  Até agora nenhuma novidade.  Agora utilizando o recurso de arredondamento.
  • 4.
    Bordas Arredondadas eSombreamento CSS3  Quanto maior for o numero para border-radius:30px maior será o arredondamento.  Adicionando o efeito sombra com box-shadow, podendo definir a propriedade da sombra e sua cor mesmo que os editores de imagem usam.  Abaixo nós vemos o formato da sombra suportado pelo Firefox 3.0  Aquele usado acima é suportado pela versão 8.0 em diante.
  • 5.
    Próxima Aula: ÚltimaAula – Validação na W3C por sua conta.