xhtml

COMANDOS BÁSICOS DE HTML

O QUE É HTML

HyperText Markup Language é uma linguagem utilizada na construção de páginas WEB. Ela é composta por vários comandos que o browser interpreta e monta graficamente um resultado.
Qualquer erro que ocorra em uma página WEB, ao contrário de outras linguagens, é ignorada pelo browser.

O QUE SÃO OS TAGS

Tags são os comandos da liguagem HTML. Eles devem sempre aparecer entre os sinais de menor e maior (< >). Além disso eles têm uma sintaxe de "liga" e "desliga", por exemplo:

Texto a ser centralizado

Não existe nenhuma diferenciação entre maiúsculas e minúsculas.

FORMATO DE UM ARQUIVO HTML

           Um arquivo HTML deve conter alguns comandos básicos, apesar de que o browser pode até interpretar o arquivo sem eles.
           São eles:

...       indica que comandos HTML se encontrarão entre os tags. Eles indicam o início e o fim do arquivo.
...     indica o cabeçalho da página, com diversas informações como por exemplo o título.
...          especifica o título da página que é mostrado na barra de títulos do navegador.

...

contém o corpo do arquivo HTML, ou seja o conteúdo em si da página, com todos os demais comandos que a compõe.

VAMOS EXERCITAR

Para isso você vai precisar do Bloco de notas e do seu navegador de Internet abertos ao mesmo tempo, após digitar os comandos no Bloco de notas você deverá salvar o documentos com extensão .html, por exemplo index.html. Sua página inicial deverá ser salva com o nome de index.html, as demais você poderá salvar como o nome que quizer, mas sempre nomeescolhido.html .
No navegador você irá abrir seu arquivo salvo em html e visualizar, quando fizer alguma alteração no Bloco de notas salve e após atualize o navegador e veja as alterações.

Vejamos um exemplo de arquivo html:

Alo mundo!

Alo mundo! Este e o meu primeiro arquivo HTML!

Vejamos o resultado deste código:

Vejamos a seguir os principais comandos para a criação de páginas simples HTML.

Cabeçalho

Como o próprio nome diz são formatos de texto próprios para cabeçalho.

...

Este forma um cabeçalho com letras grandes

...

Este forma um cabeçalho com letras pequenas

Entre eles as letras vão diminuindo de tamanho. Por exemplo

Exemplo de Cabecalho

Exemplo de cabecalho h1

Exemplo de cabecalho h2

Exemplo de cabecalho h3

Exemplo de cabecalho h4

Exemplo de cabecalho h5

Exemplo de cabecalho h6

Aqui está o resultado:

Paragrafos

Existe duas maneiras de se criar quebra de linha:

Para criar um parágrafo novo, ou seja pulando uma linha.

Para ir para a linha de baixo

Por exemplo:

Exemplo de Parágrafos

Este e o primeiro paragrafo.

Este e
o segundo paragrafo

Este e o terceiro paragrafo com
quebra de linha

Como resultado temos:

Barra de Divisão

A barra de divisão serve para colocar uma separação entre um texto e outro. Deve ser usado o seguinte TAG:

Vejamos um exemplo:

Exemplo de Barra de Divisão

Este e o primeiro conjunto de texto.

Este e o segundo conjunto de texto.

Veja o resultado:

Alinhamento

Para alinhar um parágrafo, usaremos um parâmetro do tag

Podemos usar as opções:

...

É o padrão e alinha o texto à esquerda.

...

Alinha o texto à direita.

...

Centraliza o texto.

Vejamos um exemplo:
Exemplo de Barra de Alinhamento

Alinha o texto a esquerda.

Alinha o texto a direita.

Centraliza o texto.

Veja o resultado:

Cores

Para trabalharmos com cor, usaremos um parâmetro do TAG

, mas antes disso temos que saber como funciona o processo de criação de uma cor em HTML.
HTML usa o padrão de codificação RGB em hexadecimal. RGB (Red Green Blue) usa a quantidade de cada uma das cores básicas (vermelho, verde e azul) para se criar uma cor.
Para se formar uma cor usa-se a seguinte codificação:

#RRGGBB

onde:
RR indica um número com a quantidade de vermelho (de 00 à FF)
GG indica um número com a quantidade de vermelho (de 00 à FF)
BB indica um número com a quantidade de vermelho (de 00 à FF)
Por exemplo:
Branco -> #FFFFFF
Preto -> #000000
Vermelho -> #FF0000
Verde -> #00FF00
Azul -> #0000FF
Usaremos os seguintes parâmetros do TAG

:
Bgcolor Cor do fundo.
Text Cor do texto.
Link Cor do link.
Alink Cor do link no momento que é acessado.
Vlink Cor do link anteriormente visitado.
Vejamos um exemplo:

Exemplo de Cores

Exemplo do uso de cores

Veja o resultado:

Imagens

Existem dois tipos de imagens que podemos utilizar: papel de parede e imagens própriamente ditas.
Vejamos primeiro um papel de parede. Para isso vamos colocar outro parâmetro do TAG

:

Vejamos um exemplo:

Exemplo de Papel de Parede

Este texto vem por cima da figura.

Veja o resultado:

Agora usaremos o TAG para adicionarmos uma imagem na página acima:

Exemplo de Imagens

Este texto vem por cima da figura1.

E este vem ao lado.

Veja o resultado:

Hyperlinks

Hyperlinks são comandos HTML para conectarmos páginas independentes umas com as outras, ou até mesmo uma conexão para algum arquivo.
Para isso usaremos o TAG e seu parâmetro href.

Veja o exemplo:

Exemplo de Hyperlinks

Esta frase vem antes desta

serie de palavrasque ligam o texto a outra pagina.

E este é o resultado:

Topo