Projeto de curso de HTML e CSS em 4 módulos.
Nesse projeto, onde inicio aqui meus estudos de programação, aprendi uma serie de coisas
Em relação ao HTML, foram os seguintes aprendizados:
Definindo título e parágrafos de um texto com "h1" e "p"
Dar destaque com negrito usando a tag "strong"
Como dar ênfase usando a tag itálico "em"
Estrutura básica do HTML.
Tag "doctype html"
tag "html" e definindo a linguagem com a propriedade lang;
Como passar as informações do encoding da página com a tag "meta" e com a propriedade charset;
Definindo o título da página através da tag "title";
Separar as informações usando a tag "head";
Separar o conteúdo da página utilizando a tag "body"
Divisão de conteúdo com a tag "div"
A criar um formulário HTML "form"
A tag "input", para a entrada de dados do usuário
A criar uma etiqueta para o input, com a tag "label"
A conectar um input com o seu label
Colocamos um id para o input e associamos esse id ao atributo for do label
Alguns tipos de input, como text e submit
Que label e input por padrão possuem o display inline
Alguns tipos de inputs para celular: email, tel, number, password, date, datetime, month e search;
Criar uma tabela e estilizar ela;
A utilizar fontes externas nas nossas páginas
Como incorporar um mapa à página
Como incorporar um vídeo à página
------------ Em relação ao CSS:
CSS
Apresentação dos textos:
-alimento (text-align)
-tamanho da fonte (font-size)
-cor de fundo (background)
-cor do texto (color)
-tag "style"
Utilizar identificadores para marcar especificamente um elemento
Adicionando imagem
Ajustar a altura do elemento, usando (heigth)
Ajudar a largura do elemento usando (width)
Espaçamento interno do elemento (padding)
Espaçamento externo do elemento (margin)
Classes no CSS, marcar itens, mas são repetíveis
Comportamento block e inline (display)
Use class para tudo.
Remover a decoração do texto (útil para o href) text-decoration: none.
Como funciona os posicionamentos static, relative e absolute dos elementos;
Como remover os estilos que o navegador cria automaticamente (reset.css).
A tag "main", para o conteúdo principal da nossa página
A criar listas complexas, com títulos, imagens e parágrafos
A utilizar o inline-block
A praticar e estilizar o conteúdo principal da nossa página
Aplicar bordas nos elementos
Como estilizar o botão de envio de formulário
A realizar transições nos nossos elementos, com a propriedade CSS transition
A modificar o estilo do ponteiro do mouse, quando passar por cima de determinado elemento, através da propriedade CSS cursor
A realizar transformações nos nossos elementos, como aumentar proporcionalmente a escala de determinado elemento ou rotacioná-lo, através da propriedade CSS transform
Utilizar o float
Como manipular a opacidade dos elementos, com a propriedade CSS opacity
Como manipular a opacidade das cores
Como adicionar um sombreamento em volta dos elementos, com a propriedade CSS box-shadow
Como adicionar um sombreamento em textos, com a propriedade CSS text-shadow
Design responsivo: como ajustar o estilo da nossa página de acordo com o tamanho da tela do dispositivo que a acesse:
Meta tag de Viewport
Media Queries