Aula 08 cores

241 visualizações

Publicada em

0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
241
No SlideShare
0
A partir de incorporações
0
Número de incorporações
2
Ações
Compartilhamentos
0
Downloads
2
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Aula 08 cores

  1. 1. Cores (X)HTML Professor Jolvani Aula 08
  2. 2. Cores (X)HTML  Na aula passada, vocês aprenderam a trabalhar com elementos inline, boxs inline, e nesta aula vc sairão peritos em Cores no html...  Abrindo nosso diretório de aula e criando um novo arquivo html e abrimos o documento para edição... Aula05.html  Para visualizar o documento damos um duplo clique no arquivo que ele abre no navegador...  Conhecendo sobre as cores... Em html. Nos temos três formas de usar as cores. Como eu aplico uma determinada cor em um elemento?  Um atributo que será muito usado nas aulas de CSS é o atributo style. Colocando em h1.  Opa, veja que vc pode colocar atributos nas tags.... Lembre-se que vc usou o atributo “align center” para centralizar o título na aula anterior, agora um novo atributo ... “style”.  Esse tributo define o estilo visual desse elemento, ou esse box, o h1
  3. 3. Cores (X)HTML  Após usar style eu uso a propriedade CSS color (existem muitas propriedades CSS que podem ser vistas no TopStyle, Dreamwaver  Style=“color” – como eu atribuo um valor para essa propriedade uso dois pontos (:) e como definimos os valores.  Existem 3 formas de definir um valor para esse atributo (propriedade), 1 – por nome, colocando blue, red, por exemplo; 2 – valor Decimal e 3 – Valor Hexadecimal.  Finalizando com ponto e vírgula (;) indica que eu terminei com essa propriedade.  Atributo: style  Propriedade: color
  4. 4. Cores (X)HTML  As cores seguem o padrão RGB. R – Red, G – Green, B – Blue. E vc pode definí-las nos formatos Nome, Decimal e hexadecimal...  rgb(val,val,val)  brown
  5. 5. Cores (X)HTML  Porém, onde eu consigo essas informações? Para isso vc pode usar o W3Schools. Ia vc pode se aprofundar ainda mais na linguagem.  Observe uma paleta de cores e os valores hexadecimal e decimal ao lado.
  6. 6. Cores (X)HTML  As cores, o padrão usado na Web é o hexadecimal, então encontra-se muitas referências nesse formato, e menos nos formatos Decimal e por Nome.  Vc pode ver que existem 16 milhões de possibilidades de cores (256x256x256).  Por exemplo, ao lado, vemos diversas tonalidades de vermelho.  No site vc pode escolher as cores pelo nome.  Existe algum recurso mais interessante? É necessário instalar alguma ferramenta.
  7. 7. Cores (X)HTML  Posso selecionar uma determinada cor e depois uma determinada tonalidade, copiando e colando o valor em nosso projeto.  Coloque uma outra cor no subtítulo...  E se vc não tiver acesso a internet para definir uma determinada cor, no Windows vc possui o Paint  Façamos um exemplo para ilustrar...
  8. 8. Cores (X)HTML  Abra o paint e selecione o editor de cores  Selecione a cor e copie os valores  Copie os valores para o seu projeto...  Teste-o...
  9. 9. Cores (X)HTML  Então existem essas três opções e agora vc pode usar todo esse conhecimento...  Ela também pode ser usada no corpo do documento tag <body>.  E nele vamos usar um outro atributo para colocar uma cor de fundo (background-color)  Verifique que a página ficou com uma cor de fundo diferente da anterior, e o atributo Style permite que nós definimos nossas propriedades CSS. Até a px.
  10. 10. Próxima Aula: Imagens e Edição de imagens

×