Anotações sobre tópico de HTML do Curso "Introdução a criação de web sites com HTML5 e CSS3"

#HTML

Introdução a criação de web sites com HTML5 e CSS3

SEMÂNTICA

Os elementos dentro do HTML possuem significados, os principais são:

h1 - h6 → títulos
section → sessão gerérica
header → cabeçalho
aside → conteudo relacional
article → conteudo relevante
footer → rodapé

Estrutura básica HTML

<!DOCTYPE html> //diz ao navegador o que esá escrevendo
<html>
  <head> // informações ao navegador
      <meta charset = "UTF-8"> 
      <title></title>
  </head>
  <body>
  </body>
</html>

Exemplo adcionando elementos semanticos :

<!DOCTYPE html> 
<html>
  <head> // informações ao navegador
      <meta charset = "UTF-8"> 
      <title></title>
  </head>
  <body>
<header>
  <h2> Ruan Sampaio </h2>
<header>	
<section>
  <article>
      <header> 
          <h3> </h3>
      </header>
</article>
</section>
  </body>
</html>

Textos e links

usa-se tags

<p></p> → para paragrafos e até outros elementos

para links:

a tag “a” é uma ancora que liga vários elementos.

<a>link</a>
exemplos:
<a href=”link”>Nome link </a> → hiperlik para um outro site.
<a href=”mailto:sampaioruan02@gmail.com”>Nome link </a>
<a target = “_blank”> link </a> → indica como o link será aberto. neste caso o _black abre o linkl em um nova aba.

IMAGENS

Para inserir imagens usaos a seguinte tag: img. e ela tem epnas 2 atributos próprios.

obs: site “tynepng” ele diminui o tamanho das imagens.

LISTAS

Existem dois tipos de listas no html:

<ul> aqui a ordem não importa.
<ol> ordem importa, os items da listas são enumerados.
<li> item da lista

Exemplo com ul:

<ul>
  <li> item da lista</li>
</ul>

Exemplo com ol:

<ol>
  <li> 1. item da lista</li>
  <li> 2. item da lista</li>

<ol>