Exercício prático de html e Css além de informações sobre o fim do flash.

1. CSS NA PRÁTICA
PARA WEBDESIGNERS
RENATO MELO - 2016

2. INFORMAÇÕES
ÚTEIS

3. Textos
Links
Estilo:
Fonte
Cores
Alinhamhento
Etc...
PRINCIPAL DIFERENÇA DO HTML E DO CSS

4. 3. ABRA O HTML E O CSS
NO BLOCO DE NOTAS
1. DESCOMPACTE
SEMPRE TUDO NA MESMA
PASTA
2. ABRA O HTML NO
NAVEGADOR

5. 1. ABRA O BLOCO DE NOTAS
2. VÁ EM ABRIR
3. VÁ NA PASTA DOS SEUS ARQUIVOS
4. SELECIONE PARA ABRIR TODOS OS
ARQUIVOS PARA APARECER O HTML E CSS
PARA ABRIR OS ARQUIVOS NO BLOCO DE NOTAS

6. SALVE O HTML OU CSS
NO BLOCO DE NOTAS
QUER VER COMO ESTÁ
INDO AS ALTERAÇÕES?
PRESSIONE A TECLA F5
NO NAVEGADOR

7. QUER ACHAR ALGO NO
SEU CÓDIGO?
Editar - Localizar

8. ATENÇÃO:
Na Direção, cuidado com
Acima e Abaixo

9. DIV:
O nome da DIV sempre será
o correspondente no css

10. #NA PRÁTICA

11. renatomelo.com.br/esamc/aula5web.zip

12. #ALTERAR
1. NO TÍTULO: ALTERAR
COCA COLA PARA
CONCURSO COCA COLA

13. #ALTERAR
2. NO MENU: ALTERAR
HOME PARA COCA COLA

14. #ALTERAR
3. NA CHAMADA, ALTERAR
PROMOÇÃO PARA
CONCURSO

15. #ALTERAR
4. NO TEXTO: CONCURSO
COCA COLA, TROCAR A
FONTE PARA A COR PRETA:
#000000;

16. #ALTERAR
5. NO TEXTO: AQUI VOCÊ
ENCONTRA... TROCAR A
COR DO TEXTO PARA
PRETO: #000000

17. #ALTERAR
6. ALTERAR A FONTE DO
MESMO TEXTO PARA 20px

18. #ALTERAR
7. TROCAR O LINK DO
FACEBOOK DA COCA
PARA /COCACOLA

19. #ALTERAR
8. ALTERAR A COR DOS
TÍTULOS: FACEBOOK, E-
MAIL E SMS DE BRANCO
PARA PRETO #000000

20. #ALTERAR
9. ALTERAR A COR DOS
ITENS ABAIXO DOS TÍTULOS:
FACEBOOK, E-MAIL E SMS
DE BRANCO PARA PRETO
#000000

21. #ALTERAR
10. ALTERAR A COR DO
RODAPÉ DE VERMELHO
PARA PRETO: #000000

22. Prévia
1 – Leia o artigo:
www.gosupersonic.com.br/estudo-caso/case-casa-mineira/
2 – Analise um site mal construído e aponte soluções com
foco na conversão.
- Enviar até às 18h30 do dia 21.09
renatomelo85@gmail.com / renato.melo@esamc.br

23. P1 – 21/09
próxima aula
Valor 2,0

24. FACEBOOK.COM/
RENATOMELOMKT
renato@iskadigital.com.br