Referencia HTML
- ESTRUTURA BASICA DO ARQUIVO
<!DOCTYPE html>
<html>
<head><title> </title>
<meta charset="utf-8">
</head>
<body>
</body>
</html>
- INSERIR IMAGENS – TAG HTML 5
<figure>
<img src="img/produto1.png" alt="Foto do produto">
<figcaption>LEGENDA</figcaption>
</figure>
- INSERIR COMENTARIOS
<!-- TEXTO -->
- REFERENCIA AO AQUIVO CSS EXTERNO
Dentro da tag <head>
<link rel="stylesheet" href="estilos.css">
- ELEMENTOS ESTRUTURAIS
Invariavelmente você vai cair algum dia num cenário onde não consegue achar a tag certa para aquele conteúdo.
Nesse caso, pode usar as tags <div> e <span> que funcionam como coringas. São tags sem nenhum signicado especialmas que podem servir para agruparumcerto conteúdo, tantoumbloco da página quanto um pedaço de texto.
E, como vamos ver a seguir, vamos poder estilizar esses divs e spans com CSS customizado. Por padrão, eles não têm estilo algum.
- LINKs e ANCORA
<a href="http://www.caelum.com.br">TEXTO LINK</a>.
Outro uso para a tag de âncora é a demarcação de destinos para links dentro do próprio documento, o que chamamos de bookmark.(REFERINCIA PELO ID)
<p>Mais informações <a href="#info">aqui</a>.</p>
<p>Conteúdo da página...</p>
<h2 id="info">Mais informações sobre o assunto:</h2>
<p>Informações...</p>
É possível, com o uso de um link, levar o usuário a um bookmark(ID) presente em outra página.
<a href="http://www.caelum.com.br/curso/wd43/#contato">Entre em contato sobre o curso</a>
FORMULARIOS
Em HTML, temos um elemento chamado <form> criado para esta finalidade: capturar os dados do usuárioe submetê-lo a algum servi ço da internet.
Os dados são passados para o <form> por meio de tag <input>, que pode uma ter dupla finalidade: receber os dados digitados ou submeter o formulário.
É por meio da propriedade type que definimos essa finalidade. Em nosso caso, utilizaremos o tipo search para capturar os dados digitados e o tipo image para submeter o formulário. Existe também o tipo submit, que possui a mesma nalidade do