html-css-cursoemvideo

HTML5 e CSS3 - Curso em vídeo

Curso de HTML5 e CSS3 do curso em vídeo. Estou aprendendo à criar sites no curso em vídeo, com o professor Gustavo Guanabara. Espero que aprenda bastante.

Veja os exercícios e os desafios:

Exercícios

| Imagem | Nome | Descrição | Acesso | | ——— |—-|——-| ——– | | Imagem do exercício 001 | Ex001 | Projeto inícial Com o famoso olá mundo, usando tags como h1, p, e hr.| aqui | | Imagem do exercício 002 | Ex002 | Aprendendo HTML entities e quebra de linha com br. | aqui | | Imagem do exercício 003 | Ex003 | Aprendendo a colocar imagens em HTML com img. | aqui | | Imagem do exercício 004 | Ex004 | Colocando favicons em HTML. | aqui | | Imagem do exercício 006 | Ex006 | Aprendendo hierarquia de títulos h1 até h6. | aqui | | Imagem do exercício 007 | Ex007 | aprendendo a diferença do HTML4 e HTML5, com a semântica. | html4, html5 | | Imagem do exercício 008 | Ex008 | fazendo formatações de textos de forma semântica e não semântica | aqui | | Imagem do exercício 008b | Ex008b | Outras formatações de texto. | aqui | | Imagem do exercício 009 | Ex009 | aprendendo listas html: ol, ul, dl. | aqui | | Imagem do exercício 010 | Ex010 | Aprendendo à usar links em HTML: a. | index, pag002, pag003 | | Imagem do exercício 011 | Ex011 | Aprendendo à fazer imagens responsivas e colocar áudio no HTML. | ex011 | | Imagem do exercício 011b | Ex011b | Aprendendo à colocar vídeo em HTML, a partir de um arquivo interno, do Youtube ou Vimeo | aqui | | Imagem do exercício 012 | Ex012 | Estilos in-line CSS. | aqui | | Imagem do exercício 012b | Ex012b | Estilos internos CSS. | aqui | | Imagem do exercício 012c | Ex012c | Estilos externos CSS. | aqui, pagina2 | | Imagem do exercício 013 | Ex013 | Aprendendo cores, harmonia, formas de representa-la, gradiente com css e criamos um pequeno projeto, com tudo isso. | cor01, cor02, cor03 | | Imagem do exercício 014 | Ex014 | Aprendendo à formatar fontes | fonte01, fonte02 | | Imagem do exercício 014b | Ex014b | Aprendendo à usar fontes externas tanto pelo Google Fonts, ou baixada: ttf(truetype), otf(opentype) | fonte01, fonte02 | | Imagem do exercício 015 | Ex015 | Aprendendo a diferença de class e id. E como seleciona-los no CSS. | aqui | | Imagem do exercício 015b | Ex015b | Aprendendo pseudo-elementos e pseudo-classes. | hover, links, pseudo-classe | | Imagem do exercício 016 | Ex016 | Aprendendo Box-model: box-shadow, padding, margin, border, outline, content, width, height, div, outras divs só que semântica, article, section, footer, main, header e etc. | caixa01, caixa02, caixa03 | | Imagem do exercício 017 | Ex017 | Aprendendo as propriedades do background-image, e como alinhar uma caixa verticalmente, com position relative e absolute. | fundo001, fundo002, fundo003, fundo004, fundo005, fundo005b, fundo006, fundo007. | | Imagem do exercício 018 | Tabelas | Aprendendo várias propriedades de tabelas. De forma Semântica. | Tabela001, Tabela002, Tabela003, Tabela004, Tabela005, Tabela006. | | | Iframes | Aprendendo a usar iframes. | iframe001, iframe002, iframe003, iframe004, iframe005, iframe006. | | Imagem do exercício 020 | Formulários. | Aprendendo tecnicas de formulário, tipos de input e outros. | form001, form002, form003, form004, form005, form006, form007, form008, form009, form010 | | Imagem do exercício 021 | Media Queries. | Aprendendo à usar media queries com CSS, para fazer adtaptações entre media types e features. | mq001, mq002, mq003, mq004, mq005. | | Sem Imagem | Display flex | Aprendizagem dos conceitos do display: flex. | flex-001 flex-002 flex-003 flex-004 flex-005 flex-006 flex-007 flex-008 flex-009 flex-010 flex-011 flex-012 |

Desafios

Imagem Nome Descrição Acesso
Imagem do desafio 001 Desafio 001 Desafio de quebra de linha e parágrafo. aqui
Imagem do desafio 002 Desafio 002 Imagens em HTML. aqui
Imagem do desafio 003 Desafio 003 Imagens e quebra de linha HTML. aqui
Imagem do desafio 004 Desafio 004 Emojis e listas HTML. aqui
Imagem do desafio 005 Desafio 005 Redes sóciais - links e descrição aqui
Imagem do desafio 006 Desafio 006 Abreviações e listas HTML. aqui
Imagem do desafio 007 Desafio 007 Imagens flexiveis com a tag picture aqui
Imagem do desafio 008 Desafio 008 Navegação com links e cores. aqui
Imagem do desafio 009 Desafio 009 Navegação entre alguns vídeos de curso. aqui
Imagem do desafio 010 feito por mim Desafio 010 feito por mim Desafio da história do Android, sem a ajuda do curso, no formato de vídeo. aqui
Imagem do desafio 010 feito junto em vídeo Desafio 010 feito em vídeo Desafio do Android feito junto em curso. aqui
Imagem do desafio 011 Desafio 011 Desafio do astronauta no centro. aqui
Imagem do desafio 012 feito por mim Desafio 012 feito por mim. Desafio do projeto do Cordel de Milton Duarte. aqui
Imagem do desafio 012 feito junto em vídeo Desafio 012 feito junto em vídeo Projeto Cordel Moderno, com poema criado por Milton Duarte. aqui
Imagem do desafio 013 Desafio de tabelas mescladas. Desafios de tabelas. Tabela 1, tabela 2, tabela 3
Imagem do desafio sociais - 014 Desafio das redes sóciais. Desafio feito no curso, usando a tecnológia de iframes, mostrando as redes sóciais. aqui
Imagem do desafio de login - 015 Desafio de login. Desafio feito sozinho. aqui
Imagem do desafio 015 Desafio de Login. Desafio de Login feito junto em vídeo. aqui