Curso: Desenvolvimento de sites tablelessCarga horária: 8 horas
Pré-requisitos:1. Vontade de aprender =)
Objetivo do curso:1. Apresentar fundamentos em HTML/CSS2. Apresentar técnicas para construção de sites tableless3. Introdução ao CSS3
Ementa
• Introdução (vinte minutos)• O que HTML • O que é CSS • O que é tableless • Importância do tableless
• Tags básicas HTML (cinco minutos)• <html> </html>• <head> </head>• <body> </body>
• Tags de cabeçalho HTML (dez minutos)• Inserindo imagens no documento HTML (cinco minutos)• Seletores CSS no HTML (cinco minutos)
• id• class
• Criação do arquivo CSS (cinco minutos)• Criação do arquivo• Link do CSS no HTML
• Seletores CSS básicos (tinta minutos)• Seletores de tag html• Seletores de id• Seletores de class• Encadeamento de seletores• Diferença entre seletores
• Atributos CSS básicos para textos(dez minutos)• font• color• size
• A tag HTML div (quarenta e cinco minutos)• Função da div • Trabalhando com vários elementos div • Posicionamento relativo da div • Posicionamento absoluto da div • Diferença entre o posicionamento relativo e o absoluto • O atributo float • A div clear
• Atributos CSS básicos para as divs (quinze minutos)• width• height• background• padding• border• margin
• Exercício – Montar um layout básico 3 colunas em tableless (vinte minutos)• Exercício 2 – Posicionamento avançado de divs (vinte minutos)• Links em HTML (dez minutos)• Atributos CSS básicos para links (quinze minutos)
• text-decoration• estado hover• estado visited
• Introdução a efeitos de animações com CSS (dez minutos) • Expandir o estado hover para outras tags HTML
• Listas em HTML (quinze minutos)• ul• li• ol
• Atributos CSS básicos para listas (quinze minutos)• list-style• display
• Montando um menu estilizado com CSS (vinte minutos)• Montando um menu drop-down com CSS (trinta minutos)• Inserindo imagens no HTML (dez minutos)• Atributos CSS básicos para imagens (cinco minutos)
• width• height
• Exercício – Juntando tudo o que foi aprendido (trinta minutos)• Introdução ao CSS3 (cinquenta minutos)
• box-shadow• text-shadow• Cores RGBA e opacidade• Gradiente com CSS
• Apresentação do site Collorzilla• transition• multiplos backgrounds
• Dúvidas e questionamentos (quarenta minutos)• Tempo para imprevistos (quarenta minutos)
Top Related