CSS NA PRÁTICA - WEBDESIGNRENATO MELO - 2014

Programação em Três Partes

Html: Conteúdo

CSS: Estilo

Javascript: Inteligência

nomeDefine um estilo único para um elemento: body, h1...

#nomeDefine um estilo único para um identificador

.nomeDefine um estilo único para uma classe, que pode ser utilizada qualquer hora.

TextosLinks

Estilo:FonteCoresAlinhamhentoEtc...

PRINCIPAL DIFERENÇA DO HTML E DO CSS

#TRABALHOINDV. 04.04

EXERCÍCIO PREPARATÓRIO

INFORMAÇÕESÚTEIS

3. ABRA O HTML E O CSS NO BLOCO DE NOTAS

1. DESCOMPACTE SEMPRE TUDO NA MESMA PASTA

2. ABRA O HTML NO NAVEGADOR

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

SALVE O HTML OU CSS NO BLOCO DE NOTAS

QUER VER COMO ESTÁ INDO AS ALTERAÇÕES?

PRESSIONE A TECLA F5 NO NAVEGADOR

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

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

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

renatomelomkt.com.br/esamc/bombril.zip

#ALTERAR

1. NO MENU: ALTERAR HOME PARA BOMBRIL

#ALTERAR

2. NA CHAMADA, ALTERAR PROMOÇÃO PARA CONCURSO

#ALTERAR3. ALTERAR A COR DOS TEXTOS ABAIXO DOS ITENS: FACEBOOK, E-MAIL E SMS DE CINZA PARA BRANCO #FFF

#ALTERAR4. TROCAR O LINK DO FACEBOOK DA BOMBRIL! DE /BOMBRIL PARA /BOMBRILOFICIAL

#ALTERAR

5. ALTERAR A COR DO RODAPÉ DE VERMELHO PARA PRETO: #000

FANTA:renatomelomkt.com.br/esamc/

fanta.zip

ALUNOSAMANDHA FRANÇA BELO RIBEIROANGELICA ULITZKA RODRIGUESARIÉCIA ASSUNÇÃOBRUNA PEREIRABRUNO FERNANDES NASCIMENTOELIS DOS SANTOS TAVARESFERNANDO RODOLFO DE OLIVEIRA JUNIORGUILHERME MARZANOHUGO VICENTE FERREIRAINGRID ELOY GASPARJEFFERSON ALLAN BORGESJULIANA DE OLIVEIRA ANDRADEKELLY CRISTINA ROCHA DE MOURALEONARDO TOSHIRO NAKAILINDSEY SOREN DOS SANTOS REGO LUANA MAGALHÃES FIGUEIREDO LUCIANA CÂMARA MEDEIROS

ARRUMAR:1)No menu, alterar “Romi” para Home2)Na chamada, corrigir “Promossão”3)Alterar a cor do texto “Aqui você encontra...” para branco: #fff4)Alterar a fonte do mesmo texto para 18px5)Alterar o link do facebook para a fanpage da Fanta6)Alterar a cor do texto dos itens (facebook, sms, etc) de branco para #56585b7)Alterar a fonte do texto dos itens de Comic Sans para Trebuchet, ficando: “Trebuchet, Arial, Verdana”;

renatomelomkt.com.br/esamc/lacta.zip

LACTA:

ALUNOSLUIZ RICARDO DOS SANTOSMARCELO HENRIQUE DA SILVAMARIANA DIAS DA SILVA NOVAESMARINA BUCHEDPATRÍCIA PRETELPEDRO HENRIQUERAONY VIANARAQUEL DE ALMEIDA CHAIMRENAN SIMÕES NASCIMENTORENATO JUNQUEIRATAMMY GABRIELE OLIVEIRATHAIS GANDRA DE AMORIMVANESSA BASTOS NUNESVINÍCIUS GARCIA BELAWAGNER DE ABREU FERNANDOWILLIAN MENDES

ARRUMAR:1)No menu, alterar “Promu” para Promo2)Na chamada, colocar “Promoção Lacta e Você”3)Alterar a cor do texto da Promoção Lacta de verde para # 27509c;4)Arrumar o texto “Aki você...” para o português correto.5)Alterar o link do facebook para a fanpage da Lacta6)Alterar a cor do texto dos itens (facebook, sms, etc) de branco para #56585b7)Alterar a cor de fundo do rodapé de laranja para # 27509c

#ENTREGAENVIE PARA:

renatomelo85@gmail.com

#PRÉVIA 03O HTML5 NA WEB

Leia o artigo e faça uma análise da Leia o artigo e faça uma análise da importância da programação em importância da programação em HTML5 para as vendas online: HTML5 para as vendas online: http://www.e-smart.com.br/blog/http://www.e-smart.com.br/blog/

evolucao-html5-participacao-commerce/evolucao-html5-participacao-commerce/

#PRÉVIA 03REGRINHAS BÁSICAS

Enviar para o e-mail: Enviar para o e-mail: renatomelo85@gmail.comrenatomelo85@gmail.com

1- Até 21.03 às 18h30 – 100% VALOR1- Até 21.03 às 18h30 – 100% VALOR2- Até 28.03 às 18h30 – 50% VALOR2- Até 28.03 às 18h30 – 50% VALOR

3- APÓS ÀS 18H30 DO DIA 28.03 = 0% 3- APÓS ÀS 18H30 DO DIA 28.03 = 0% VALORVALOR

FACEBOOK.COM/RENATOMELOMKT

renato@iskadigital.com.br