HTML Tutorial

Sign Guestbook

View Guestbook

HTML

HTML (Hyper Text Markup Language) é a linguagem de marcação de hipertexto. Hipertexto é um documento de texto que possui vínculo com outros documentos, e que é dividido em diversos segmentos por marcas, rótulos, elementos (de marcação) ou simplesmente tags. As tags são delimitadas pelos sinais < (menor) e > (maior) e são classificadas em container tags e empty tags. As container tags definem a formatação de um segmento do documento e por isso apresentam-se em pares, uma que marca o início do segmento e outra que marca o final (idêntica à primeira, mas iniciada pelo sinal </ ). As empty tags definem objetos ou propriedades do documento, e são únicas, isto é, não se apresentam aos pares porque não delimitam segmentos do segmento. As tags podem ter argumentos ou atributos que modificam sua funcionalidade, como veremos a seguir.
Estrutura básica de um documento HTML:

<html>
	<head>
	</head>
	<body>
	</body>
</html>

As tags <html> e </html> delimitam o documento, que se divide em 2 partes principais:
- cabeçalho, compreendido entre as tags <head> e </head>, onde ficam as informações sobre o documento.
- corpo, compreendido entre as tags <body> e </body>, onde é apresentado o conteúdo do documento.

O cabeçalho e suas tags

A container tag <head> delimita o cabeçalho e não contém atributos. Entre essas tags pode haver as tags: <title>, <meta>, <base>, <isindex>, <script>, <link> e <style>. No momento, vamos nos deter apenas nas 3 primeiras:

A container tag <title> contém o título do documento, que será apresentado na barra superior do browser.

<title>Título_do_documento</title>

A empty tag <meta> contém informações adicionais que são colocadas nos atributos name, http-equiv e content, da seguinte forma:

<meta name="author" content="nome_do_autor">
<meta name="date" content="data_qualquer">
<meta name="description" content="resumo_do_conteúdo_da_página">
<meta name="keywords" content="palavras-chave_que_identificam_a_página">
<meta http-equiv="refresh" content="30">
<meta http-equiv="refresh" content="20; url=http://endereço">

A empty tag <base> especifica a base de referências do documento através do atributo href (hypertext reference) cujo valor é a URL (endereço) da localização original do documento.

<base href="http://www.seusite.com.br/">

Uma referência a um objeto em sua página, como outra página, um frame, um applet, um arquivo de som, vídeo ou imagem, que seja local (isto é, esteja no mesmo servidor) como por exemplo "imagens/foto1.gif", é uma URL parcial ou relativa, que é transformada pelo navegador na seguinte URL absoluta: "http://www.seusite.com.br/imagens/foto1.gif"
Se você mudar a sua página para outro local na rede e aquele objeto permanecer no servidor original, use a tag <base>. Se ela não for incluída, a URL do próprio documento é usada como base para as referências.

O corpo e suas tags

A container tag <body> delimita o corpo do documento e contém 7 atributos (4 deles relativos a texto e fundo):
- o atributo bgcolor especifica a cor de fundo do documento.

<body bgcolor="blue">

- o atributo background especifica uma imagem como fundo (papel de parede) para o documento.

<body background="imagens/foto1.gif">

- o atributo bgproperties="fixed" faz com que a imagem de fundo não role (scroll) com o texto através do documento.

<body bgproperties="fixed">

- o atributo text especifica a cor do texto no documento.

<body text="red">

A container tag <a> (anchor, âncora) é a mais importante de todas porque diferencia um documento HTML de qualquer outro documento de texto permitindo sua interligação com outros documentos na rede através de um simples clique no mouse. Ela possui 3 atributos:
- o atributo name define o nome da âncora e é usado para identificar um exato ponto dentro do próprio documento HTML ou em qualquer outro, local ou remoto.
- o atributo href (citado acima) define o endereço da âncora referindo-se ao endereço (URL) de uma determinada página ou de uma determinada âncora (neste caso, o endereço é seguido pelo símbolo # e o nome da ãncora).
A URL (Uniform Resource Locator) é o endereço (localizador) de um arquivo (recurso), usado pelo navegador "que nele aporta jogando sua âncora", com a seguinte sintaxe:
método de acesso :// nome do servidor : porta de acesso / caminho / nome do arquivo parâmetros
Ex.: http://www.seusite.com.br

- o atributo target define o alvo da âncora referindo-se ao nome de uma determinada janela ou frame (onde uma página será carregada).
O objeto (um texto, uma imagem etc) inserido entre as tags <a> e </a> é chamado de hyperlink ou simplesmente link (vínculo, referência). O código a seguir torna o texto "Voltar" em um link para o início deste documento, onde está a âncora cujo nome é "início" (é invisível porque não existe nada entre suas tags de abertura <a> e fechamento </a>).

<a name="inicio"></a>
<a href="HTML/index.htm#inicio">Voltar</a>

Voltar

A tag <body> também possui 3 atributos relativos a links:
- o atributo link especifica a cor dos links.

<body link="nome_de_uma_cor">

- o atributo vlink especifica a cor dos links recentemente visitados.

<body vlink="nome_de_uma_cor">

- o atributo alink especifica a cor do link ativo no momento (isto é, sendo clicado pelo mouse).

<body alink="nome_de_uma_cor">

Há muitas outras tags (cerca de 60!) que definem a formatação e alinhamento de texto, a criação de títulos e linhas divisórias, o aspecto de listas, tabelas e formulários, o tratamento de recursos de som, vídeo e imagem, além de applets (aplicativos Java), quadros, janelas etc, temas que serão abordados ao longo desse tutorial

Hosted by www.Geocities.ws