legal =), me fez relembrar velhos tempos ^^.
- Fórum
- OTServ
- Recursos
- Linguagens de Programação
- Programação Web
- Tutorial Sobre Html - Parte 1
3
1.6k
3 meses depois...
info
Grupo: Artesão
Registrado: 23/07/06
Posts: 143
Reputação: +1
Char no Tibia: Wizzard Marotow

04 de dezembro de 2007 às 15:22
7 meses depois...



info
Grupo: Cavaleiro
Registrado: 03/08/05
Posts: 184
Reputação: +5
Tutorial HTML - Parte 1
Abaixo está um tutorial básico sobre HTML para quem está dando os primeiros passos na criação de Web sites.
Estrutura básica:
A estrutura de um documento HTML é basicamente igual ao exemplo abaixo:
Obs.: Tanto faz escrever <TITLE>, <Title> ou <title>, as tags não são sensíveis à caixa (alta ou baixa).
Tags <HTML> e </HTML>:
As tag <HTML> e </HTML> indicam o início e o fim de um documento HTML.
Seção Head:
A seção head contém informações que são lidas pelo navegador antes do documento HTML ser exibido na tela, como o título, informações de procura, autor, editor HTML, entre outros.
Tags <HEAD> e </HEAD>:
As tags <HEAD> e </HEAD> indicam o início e o fim do cabeçalho do documento HTML.
Tags <TITLE> e </TITLE>:
O título do documento ou nome da página deve ser colocado entre as tags <TITLE> e </TITLE>, que deve aparecer apenas uma vez no cabeçalho (entre as tags <HEAD> e </HEAD>).
Meta tags:
Meta tags são tags com informações sobre a página, que não afetam sua aparência, elas aparecem entre as tags <HEAD> e </HEAD>. As principais meta tags são:
Refresh - Atualiza ou carrega uma próxima página após um determinado espaço de tempo. Veja os exemplos abaixo:
<META HTTP-EQUIV="Refresh" CONTENT="x">: Atualiza a página a cada x segundos.
<META HTTP-EQUIV="Refresh" CONTENT="x;URL=http://www.crieseuwebsite.com">: Carrega a URL em x segundos.
Description - Possui uma breve descrição do site. Use no máximo 200 caracteres. Exemplo: <META NAME="Description" CONTENT="Breve descrição da página">.
Keywords - Possui as palavras-chave do site separadas por vírgulas. Exemplo: <META NAME="Keywords" CONTENT="Palavra01, palavra02, palavra03, etc">.
Generator - Contém o nome e a versão da ferramenta usada na criação da página. Exemplo: <META NAME="Generator" CONTENT="Ferramenta usada">.
Seção Body:
A seção body é onde você coloca textos, imagens, tabelas, formulários, etc. É também na seção body que você configura o background, links, cores dos textos, entre outros atributos.
Tags <BODY> e </BODY>:
As tags <BODY> e </BODY> indicam o início e o fim do corpo, ou seção principal, do documento HTML.
Background:
O atributo background permite colocar um gráfico de plano de fundo para ser mostrado por trás de textos e imagens na página. Exemplo: <BODY BACKGROUND="imagem.extensão">.
Bgproperties:
Para criar um efeito marca d'água em sua página, onde o plano de fundo fica fixo enquanto o documento rola sobre ele, use o atributo bgproperties e a opção fixed. Exemplo: <BODY BACKGROUND="imagem.extensão" BGPROPERTIES="Fixed">.
Obs.: Apenas para o Internet Explorer.
Bgcolor:
O atributo bgcolor pinta o plano de fundo do documento inteiro com a cor que você escolher. Exemplo: <BODY BGCOLOR="#3300CC">.
Link, vlink, alink e text:
O atributo link determina a cor de todos os links que não foram acessados, vlink determina a cor de todos os links que já foram acessados e alink determina a cor do link no momento em que ele é clicado.
O atributo "text" determina a cor padrão dos textos em seu documento.
Leftmargin e topmargin:
Leftmargin e topmargin definem respectivamente o número de pixels de onde a margem esquerda e a margem superior devem começar. Exemplo: <BODY LEFTMARGIN="10" TOPMARGIN="16">.
Obs.: Apenas para o Internet Explorer.
Marginwidth e marginheight:
No Netscape 4.0 ou superior, marginwidth e marginheight definem respectivamente o número de pixels de onde a margem esquerda e a margem superior devem começar. Exemplo: <BODY MARGINWIDTH="10" MARGINHEIGHT="16">.
Créditos: absolutamente para Rafael Hayashi, do Crieseuwebsite.com.