O QUE É HTML?
Um documento escrito em HTML (Hiper Textos Markup Language) é um texto comum no formato ASCII.
O QUE É HIPERTEXTO?
Hipertexto são aqueles itens marcados numa página WEB que, quando clicados, levam a imagens ou informações mais detalhadas sobre o assunto. O Hipertexto é um texto (ou uma imagem) grifado e destacado na página por uma cor diferente da cor do texto no qual está inserido. Quando se coloca o cursor sobre o hipertexto, o cursor muda seu formato para um ícone representado por uma mão.
Exemplo de Hipertexto: Clique aqui para...
CRIANDO UMA PÁGINA HTML USANDO UM EDITOR DE TEXTO
Uma página HTML pode ser criada em qualquer editor de texto (Bloco de Notas, WordPad, etc), desde que seja salvo no formato ASCII.
Por exemplo: Se você criar um documento usando Bloco de Notas, deve salvá-lo no formato .txt. Ao salvá-lo modifique a extensão .txt para .htm ou .html. Se seu documento, no formato .txt se chama Index.txt altere-o para Index.htm ou Index.html. Porém, lembre-se que o documento somente pode ser considerado HTML se nele houver o esqueleto da linguagem HTML.
AS TAGS
As marcas utilizadas para produzir o hipertexto são chamadas tags. Uma tag consiste dos sinais < (menor que) e > (maior que) e um texto dentro deles. A notação por exemplo é uma tag para o título do documento.
As tags devem ser usadas em pares, devendo haver uma tag que inicia a marcação e uma tag que a finaliza. A tag de finalização deve ter uma barra "/" antes do texto. Por exemplo, a marcação completa para o título de um documento é:
Título do Documento
Algumas marcações, no entanto, como as tags de início de parágrafo
não necessitam de seus pares.
Todo documento HTML deve iniciar com a tag e finalizar com o seu par .
Um documento HTML não faz diferença entre maiúsculas e minúsculas. Portanto tanto faz usar como .
O ESQUELETO DE UMA PÁGINA HTML
Um documento HTML divide-se em 2 partes essenciais: cabeçalho e corpo. Veja o exemplo abaixo:
Tag de início do documento
(cabeça do documento)
título do documento
(final de cabeça do documento)
CABEÇALHO
(tag de início do corpo)
(tag de final do corpo)
CORPO
Tag de final do documento
CABEÇALHO DO DOCUMENTO
A cabeça do documento deve conter as informações mais essenciais da página.
Coloca-se no cabeçalho o Título do documento, a descrição, palavras chaves e comentários
O TÍTULO
Todo documento HTML deve ter um título que servirá para identificar o documento. O título do documento não é visualizado na página mas aparece na barra de título do browser de navegação. O título não é o mesmo que cabeçalho. O título é o nome do arquivo. É através do título que sua home page será procurada pelos catálogos de busca.
A tag de título é:
Por exemplo: minha página tem o título CINCO PASSOS PARA CONSTRUIR SUA HOME PAGE. Então a tag para o título de minha página é:
CINCO PASSOS PARA CONSTRUIR SUA HOME PAGE
A DESCRIÇÃO
A cabeça do documento deve conter uma descrição da página. Sobre o que ela trata e o que tem a oferecer. A tag para a descrição é:
Por exemplo: minha página trata de HTML. A notação para minha página é a seguinte:
PALAVRAS CHAVES
As palavras chaves também servirão para a busca de sua home page. A tag de palavras chaves é:
A notação acima para minha página é:
COMENTÁRIOS
Você pode inserir comentários adicionais na cabeça do seu documento usando a marcação
Portanto o cabeçalho de um documento HTML ficaria assim:
(início da cabeça)
Como Fazer uma Home Page
(final de cabeça)
O CORPO
O corpo do documento é a parte que aparece na Home Page. O texto de algumas tags colocadas nesta sessão do documento não são visualizados na tela, mas sim os seus efeitos. É o caso, por exemplo, das tags de padrão de fundo, cor de texto e cores de link, vlink e alink.
PADRÕES DE FUNDO
Uma Home page pode conter uma textura como padrão de fundo, um arquivo no formato gif ou jpg, ou utilizar as cores do padrão RGB. A notação para os dois padrões de fundo são:
(1)
Esta notação indica fundos com textura. Se o arquivo gif estiver no mesmo servidor, mas em outro diretório, deve ser indicado o seu caminho path/name. Se estiver em outro servidor, sua URL deve ser indicada:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Dica: Use para fixar o fundo da página na tela.
(2)
Esta notação indica fundos no padrão RGB. Usa-se um código no formato hexadecimal precedido pela tralha #. Clique em Tabela de Cores para ver as cores com seus respectivos códigos RGB.
CORES DO TEXTO
As cores do texto são indicadas, usando-se o mesmo código hexadecimal dos padrões de fundo RGB. A notação para indicar a cor do texto é:
OS LINKS
Os termos que aparecem em destaque na página, geralmente sublinhados e em cores diferentes, são textos que indicam uma ligação hipertexto.
A NATUREZA DOS LINKS
(1) Pode-se ligar partes de um texto ou imagens no mesmo documento. Este tipo de link encaixa-se na categoria de link relativo.
(2) Pode-se ligar partes de um texto ou imagens de outros documentos localizados no mesmo diretório. Este tipo de link encaixa-se na categoria de link relativo.
(3) Pode-se ligar partes de um texto ou imagens de outros documentos localizados em diretório diferente. Este tipo de link encaixa-se na categoria de link relativo.
(4) Pode-se ligar partes de um texto ou imagens de outros documentos localizados em Provedor diferente. Este tipo de link encaixa-se na categoria de link absoluto.
A tag que faz a ligação hipertexto é , que é chamada de âncora. A notação completa para um link é:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
LINKS RELATIVOS
(1) Links no mesmo documento:
Para interligar parte de um texto a outro texto no mesmo documento, usa-se uma âncora de nome, para identificar o primeiro trecho do texto, e uma âncora interna para identificar a outra parte do texto.
A âncora de nome e a âncora interna devem possuir uma palavra chave, idêntica em ambas.
Após as aspas da âncora interna e antes da palavra chave, usa-se a tralha (#).
No primeiro trecho, usa-se uma âncora de nome, cuja notação é:
No segundo trecho, usa-se uma âncora interna, cuja notação é:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
(2) Links para outros documentos:
A notação utilizada para links em diretórios diferentes é igual a anterior, devendo, entretanto indicar-se o nome do arquivo na âncora interna. A notação é:
(3) Links para documentos em diretórios diferentes:
A notação é idêntica a do item (2), devendo, entretanto, indicar-se o nome do diretório.
Exemplo:
LINKS ABSOLUTOS
Quando se interliga textos ou imagens de provedores diferentes, usa-se links absolutos.
Os links absolutos devem ser indicado pelo uso da URL (Uniform Resource Locators). A notação para links absolutos é:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Por exemplo, para fazer um link absoluto em sua homepage com a página inicial deste documento, usa-se:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
CORES DOS LINKS
1 Links
Pode-se utilizar qualquer cor para o link, no entanto recomenda-se a cor padrão azul (blue) indicada pelo código rgb=#0000FF.
Isto porque quando se clica sobre um link sua cor é alterada para indicar ao usuário que aquele link já foi consultado.
Se não for indicada a cor do link, ele será automaticamente exibido na cor padrão configurada no seu browser, geralmente na cor azul.
2 Vlink
Indica a cor dos links já consultados.
3 Alink
Indica a cor do links ativados na página.
A notação para indicar as cores dos links, alinks e vlinks é:
vlink="#rrggbb" alink="#rrggbb">
ou
alink="#rrggbb">
O SUBTÍTULO
É o título que aparece na Home Page. Não deve ser confundido com o título do documento, que não é visualizado na página, mas aparece no alto da tela. O título é inserido na seção do cabeçalho enquanto o subtítulo é colocado na seção do corpo documento HTML
O subtítulo possui 6 níveis de tamanho, numerados de 1 a 6.
Usa-se a tag, onde "y" é um número entre 1 a 6.
Os níveis para subtítulo são em número de seis, conforme tabela abaixo:
nível 1
nível 2
nível 3
nível 4
nível 5
nível 6
FORMATAÇÃO DO TEXTO
O documento HTML não segue o padrão de formatação da maioria dos editores de texto. Ele não possui recursos para aumentar o espaço entre as palavras e entrelinhas nem para forçar a justificação do texto. Para obter esses recursos é preciso utilizar a tag apropriada.
A listagem a seguir mostra a função de cada tag:
Quebra de Linha
faz uma quebra de linha, mas não acrescenta espaço entre as linhas.
Exemplo:
O documento HTML não segue
o padrão de formatação...
O texto acima é visualizado da seguinte forma:
O documento HTML não segue (quebra de linha)
o padrão de formatação...
Quebra de texto sem alinhamento
O alinhamento de imagens muitas vezes força o texto a acompanhar o alinhamento, tornando difícil o seu posicionamento. A tag
ou
libera o texto desse alinhamento. Para posicionar o texto em ambas as margens use
Parágrafo
centraliza o texto.
TEXTO PRÉ-FORMATADO
Existe um recurso para apresentar o texto exatamente na forma em que ele foi digitado. Usando-se a tag serão mantidos os espaços e tabulações.
Exemplo:
Este texto será mostrado na forma como foi digitado.
Existe um
recurso
para apresentar
o texto exatamente
na forma em que ele foi digitado
Para inserir espaço entre palavras usa-se e
LISTAS NÃO NUMERADAS
Para apresentar uma lista de opções não numeradas use as seguintes tags:
LISTAS NUMERADAS
Para apresentar uma lista de opções numeradas automaticamente, use as seguintes tags:
LISTAS DE DEFINIÇÕES
Apresenta uma série de definições, cada uma com um termo abreviado em destaque.
Exemplo:
O exemplo acima poderia ser de uma lista de alimentos:
Então este exemplo é mostrado assim:
Frutas
São alimentos comestíveis adocicados...
Legumes
São frutos secos... constituídos de um só carpelo.
INSERINDO IMAGENS
Para inserir imagens use a seguinte notação:
(1) Arquivos de imagens que estão no mesmo diretório:
Ex.
(2) Arquivos de imagens que estão em diretórios diferentes:
Ex.
(3) Arquivos de imagens externos:
Para inserir imagens use a seguinte notação:
(1) Arquivos de imagens que estão no mesmo diretório:
Exemplo:
(2) Arquivos de imagens que estão em diretórios diferentes:
Exemplo:
(3) Arquivos de imagens externos:
Moldura em imagens
Use
Use
Dica: Use para uma descrição alternativa da imagem. Para usar uma imagem como link, sem borda, use < img src="imagem" border="0">
POSICIONANDO IMAGENS
Para definir a posição das imagens, usa-se 5 notações:
(1) Imagem à esquerda:
posiciona a imagem à esquerda do texto:
BorboletaTexto com imagem
alinhada à esquerda
(2) Imagem à direita:
posiciona a imagem à direita do texto:
BorboletaTexto com imagem
alinhada à direita
(3) Texto alinhado ao topo da imagem:
BorboletaTexto no topo da imagem
(4) Texto alinhado ao rodapé da imagem:
BorboletaTexto no rodapé da imagem
(5) Texto alinhado ao centro da imagem:
BorboletaTexto no centro da imagem
INFORMAÇÕES DE RODAPÉ
Para inserir seu endereço na página, utilize a seguinte marcação:
Coloca-se no endereço o nome do autor do documento e o endereço para contato.
COMO INSERIR SEU EMAIL
Para inserir o endereço eletrônico usa-se a URL e a notação mailto.
A URL indica para onde deve ir a mensagem. A notação mailto abre o programa de correio configurado no seu navegador.
A sintaxe para o link de endereço eletrônico é:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Exemplo:
O meu endereço eletrônico é [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Para inserí-lo em minha página usei a seguinte notação:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Para usar uma imagem como link para seu email, use a seguinte notação:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Não se esqueça de alterar o texto [Tens de ter uma conta e sessão iniciada para poderes visualizar este link] pelo seu login e pelo nome do seu provedor de email, bem como alterar "imagem.gif pelo nome de sua imagem.
INSERINDO BARRAS
Para inserir barras horizontais basta utilizar a seguinte tag:
. Esta tag é ímpar e não possui par.
Para exibir uma barra normal, use:
Grossura das Barras
Para exibir barras mais grossas, use o termo size (volume) em conjunto com a tag
Largura das Barras
Para controlar a largura das barras use a palavra width e a porcentagem com o sinal de igual. Exemplo:
Alinhando as Barras
Para alinhas as barras use as palavras Left, Right ou Center para alinhar à esquerda, à direita ou centralizar a barra. Exemplo:
Barras Animadas
Para inserir barras animadas (imagens gifs) use a sintaxe de inserção de imagens:
TAGS ESPECIAIS
As notações presentes em marcações, devem ser representadas com notações especiais para que possam ser exibidas na tela. Estas notações especiais sempre se iniciam por & (E comercial) e encerram-se com ; (ponto e vírgula).
Notação
Descrição
Aparência
<
Maior que
>
>
Menor que
<
&
E comercial
&
"
Aspas duplas
"
®
Marca registrada
®
©
Copyrights
©
É possível utilizar padrões de acentuação do Windows em documentos HTML, no entanto apenas poderá visualizar a acentuação o computador que reconhecer este padrão específico.
Para permitir a visualização de caracteres das marcações, por um grande número de máquinas, use o padrão ISO-Latin Alphabet, conforme tabela abaixo:
Caracter
Notação
Acento agudo
&xacute; onde x é uma letra qualquer, maiúscula ou minúscula
Acento grave
&xgrave; onde x é uma letra qualquer, maiúscula ou minúscula
Acento circunflexo
◯ onde x é uma letra qualquer, maiúscula ou minúscula
Letra com til
&xtilde; onde x é uma letra qualquer, maiúscula ou minúscula
Letra com trema
&xuml; onde x é uma letra qualquer, maiúscula ou minúscula
Cedilha
Ç = Ç ou ç = ç
Letras unidas
&Aelig; = Æ ou æ = æ
Letra com argola
Å = Å ou å = å
N com til
Ñ = Ñ ou ñ = ñ
O cortado
Ø = Ø ou Ø = ø
Fonte: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Um documento escrito em HTML (Hiper Textos Markup Language) é um texto comum no formato ASCII.
O QUE É HIPERTEXTO?
Hipertexto são aqueles itens marcados numa página WEB que, quando clicados, levam a imagens ou informações mais detalhadas sobre o assunto. O Hipertexto é um texto (ou uma imagem) grifado e destacado na página por uma cor diferente da cor do texto no qual está inserido. Quando se coloca o cursor sobre o hipertexto, o cursor muda seu formato para um ícone representado por uma mão.
Exemplo de Hipertexto: Clique aqui para...
CRIANDO UMA PÁGINA HTML USANDO UM EDITOR DE TEXTO
Uma página HTML pode ser criada em qualquer editor de texto (Bloco de Notas, WordPad, etc), desde que seja salvo no formato ASCII.
Por exemplo: Se você criar um documento usando Bloco de Notas, deve salvá-lo no formato .txt. Ao salvá-lo modifique a extensão .txt para .htm ou .html. Se seu documento, no formato .txt se chama Index.txt altere-o para Index.htm ou Index.html. Porém, lembre-se que o documento somente pode ser considerado HTML se nele houver o esqueleto da linguagem HTML.
AS TAGS
As marcas utilizadas para produzir o hipertexto são chamadas tags. Uma tag consiste dos sinais < (menor que) e > (maior que) e um texto dentro deles. A notação
As tags devem ser usadas em pares, devendo haver uma tag que inicia a marcação e uma tag que a finaliza. A tag de finalização deve ter uma barra "/" antes do texto. Por exemplo, a marcação completa para o título de um documento é:
Algumas marcações, no entanto, como as tags de início de parágrafo
, quebra de linha
e inserção de barra
não necessitam de seus pares.
Todo documento HTML deve iniciar com a tag e finalizar com o seu par .
Um documento HTML não faz diferença entre maiúsculas e minúsculas. Portanto tanto faz usar
O ESQUELETO DE UMA PÁGINA HTML
Um documento HTML divide-se em 2 partes essenciais: cabeçalho e corpo. Veja o exemplo abaixo:
Tag de início do documento
(cabeça do documento)
(final de cabeça do documento)
CABEÇALHO
Primeiro nível de cabeçalho
Segundo nível de cabeçalho
(tag de final do corpo)
CORPO
Tag de final do documento
CABEÇALHO DO DOCUMENTO
A cabeça do documento deve conter as informações mais essenciais da página.
Coloca-se no cabeçalho o Título do documento, a descrição, palavras chaves e comentários
O TÍTULO
Todo documento HTML deve ter um título que servirá para identificar o documento. O título do documento não é visualizado na página mas aparece na barra de título do browser de navegação. O título não é o mesmo que cabeçalho. O título é o nome do arquivo. É através do título que sua home page será procurada pelos catálogos de busca.
A tag de título é:
Por exemplo: minha página tem o título CINCO PASSOS PARA CONSTRUIR SUA HOME PAGE. Então a tag para o título de minha página é:
A DESCRIÇÃO
A cabeça do documento deve conter uma descrição da página. Sobre o que ela trata e o que tem a oferecer. A tag para a descrição é:
Por exemplo: minha página trata de HTML. A notação para minha página é a seguinte:
PALAVRAS CHAVES
As palavras chaves também servirão para a busca de sua home page. A tag de palavras chaves é:
A notação acima para minha página é:
COMENTÁRIOS
Você pode inserir comentários adicionais na cabeça do seu documento usando a marcação
Portanto o cabeçalho de um documento HTML ficaria assim:
(início da cabeça)
(final de cabeça)
O CORPO
O corpo do documento é a parte que aparece na Home Page. O texto de algumas tags colocadas nesta sessão do documento não são visualizados na tela, mas sim os seus efeitos. É o caso, por exemplo, das tags de padrão de fundo, cor de texto e cores de link, vlink e alink.
PADRÕES DE FUNDO
Uma Home page pode conter uma textura como padrão de fundo, um arquivo no formato gif ou jpg, ou utilizar as cores do padrão RGB. A notação para os dois padrões de fundo são:
(1)
Esta notação indica fundos com textura. Se o arquivo gif estiver no mesmo servidor, mas em outro diretório, deve ser indicado o seu caminho path/name. Se estiver em outro servidor, sua URL deve ser indicada:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Dica: Use
(2)
Esta notação indica fundos no padrão RGB. Usa-se um código no formato hexadecimal precedido pela tralha #. Clique em Tabela de Cores para ver as cores com seus respectivos códigos RGB.
CORES DO TEXTO
As cores do texto são indicadas, usando-se o mesmo código hexadecimal dos padrões de fundo RGB. A notação para indicar a cor do texto é:
OS LINKS
Os termos que aparecem em destaque na página, geralmente sublinhados e em cores diferentes, são textos que indicam uma ligação hipertexto.
A NATUREZA DOS LINKS
(1) Pode-se ligar partes de um texto ou imagens no mesmo documento. Este tipo de link encaixa-se na categoria de link relativo.
(2) Pode-se ligar partes de um texto ou imagens de outros documentos localizados no mesmo diretório. Este tipo de link encaixa-se na categoria de link relativo.
(3) Pode-se ligar partes de um texto ou imagens de outros documentos localizados em diretório diferente. Este tipo de link encaixa-se na categoria de link relativo.
(4) Pode-se ligar partes de um texto ou imagens de outros documentos localizados em Provedor diferente. Este tipo de link encaixa-se na categoria de link absoluto.
A tag que faz a ligação hipertexto é , que é chamada de âncora. A notação completa para um link é:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
LINKS RELATIVOS
(1) Links no mesmo documento:
Para interligar parte de um texto a outro texto no mesmo documento, usa-se uma âncora de nome, para identificar o primeiro trecho do texto, e uma âncora interna para identificar a outra parte do texto.
A âncora de nome e a âncora interna devem possuir uma palavra chave, idêntica em ambas.
Após as aspas da âncora interna e antes da palavra chave, usa-se a tralha (#).
No primeiro trecho, usa-se uma âncora de nome, cuja notação é:
No segundo trecho, usa-se uma âncora interna, cuja notação é:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
(2) Links para outros documentos:
A notação utilizada para links em diretórios diferentes é igual a anterior, devendo, entretanto indicar-se o nome do arquivo na âncora interna. A notação é:
(3) Links para documentos em diretórios diferentes:
A notação é idêntica a do item (2), devendo, entretanto, indicar-se o nome do diretório.
Exemplo:
LINKS ABSOLUTOS
Quando se interliga textos ou imagens de provedores diferentes, usa-se links absolutos.
Os links absolutos devem ser indicado pelo uso da URL (Uniform Resource Locators). A notação para links absolutos é:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Por exemplo, para fazer um link absoluto em sua homepage com a página inicial deste documento, usa-se:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
CORES DOS LINKS
1 Links
Pode-se utilizar qualquer cor para o link, no entanto recomenda-se a cor padrão azul (blue) indicada pelo código rgb=#0000FF.
Isto porque quando se clica sobre um link sua cor é alterada para indicar ao usuário que aquele link já foi consultado.
Se não for indicada a cor do link, ele será automaticamente exibido na cor padrão configurada no seu browser, geralmente na cor azul.
2 Vlink
Indica a cor dos links já consultados.
3 Alink
Indica a cor do links ativados na página.
A notação para indicar as cores dos links, alinks e vlinks é:
vlink="#rrggbb" alink="#rrggbb">
ou
alink="#rrggbb">
O SUBTÍTULO
É o título que aparece na Home Page. Não deve ser confundido com o título do documento, que não é visualizado na página, mas aparece no alto da tela. O título é inserido na seção do cabeçalho
O subtítulo possui 6 níveis de tamanho, numerados de 1 a 6.
Usa-se a tag
Os níveis para subtítulo são em número de seis, conforme tabela abaixo:
nível 1
nível 1
nível 2
nível 2
nível 3
nível 3
nível 4
nível 4
nível 5
nível 5
nível 6
nível 6
FORMATAÇÃO DO TEXTO
O documento HTML não segue o padrão de formatação da maioria dos editores de texto. Ele não possui recursos para aumentar o espaço entre as palavras e entrelinhas nem para forçar a justificação do texto. Para obter esses recursos é preciso utilizar a tag apropriada.
A listagem a seguir mostra a função de cada tag:
Quebra de Linha
faz uma quebra de linha, mas não acrescenta espaço entre as linhas.
Exemplo:
O documento HTML não segue
o padrão de formatação...
O texto acima é visualizado da seguinte forma:
O documento HTML não segue (quebra de linha)
o padrão de formatação...
Quebra de texto sem alinhamento
O alinhamento de imagens muitas vezes força o texto a acompanhar o alinhamento, tornando difícil o seu posicionamento. A tag
ou
libera o texto desse alinhamento. Para posicionar o texto em ambas as margens use
Parágrafo
inicia um novo parágrafo acrescentando espaço entre as linhas.
Exemplo:
O documento HTML não segue
o padrão de formatação...
O texto acima aparece da seguinte forma:
O documento HTML não segue
(espaço entre linhas)
o padrão de formatação...
coloca o texto em negrito.
coloca o texto em itálico.
TEXTO PRÉ-FORMATADO
Existe um recurso para apresentar o texto exatamente na forma em que ele foi digitado. Usando-se a tag serão mantidos os espaços e tabulações.
Exemplo:
Existe um
recurso
para apresentar
o texto exatamente
na forma em que ele foi digitado
Este texto será mostrado na forma como foi digitado.
Existe um
recurso
para apresentar
o texto exatamente
na forma em que ele foi digitado
Para inserir espaço entre palavras usa-se e
para espaços entre linhas.
LISTAS NÃO NUMERADAS
Para apresentar uma lista de opções não numeradas use as seguintes tags:
- (tag de início de lista não numerada)
- item 1
- item 2
- item 3
LISTAS NUMERADAS
Para apresentar uma lista de opções numeradas automaticamente, use as seguintes tags:
- (tag de início de lista numerada)
- item 1
- item 2
- item 3
LISTAS DE DEFINIÇÕES
Apresenta uma série de definições, cada uma com um termo abreviado em destaque.
Exemplo:
- (tag de início de lista de definições)
- (tag de termo abreviado)
- (defininão)
- (tag de termo abreviado)
- (defininão)
O exemplo acima poderia ser de uma lista de alimentos:
- Frutas
- São alimentos comestíveis adocicados...
- Legumes
- São frutos secos... constituídos de um só carpelo.
Então este exemplo é mostrado assim:
Frutas
São alimentos comestíveis adocicados...
Legumes
São frutos secos... constituídos de um só carpelo.
INSERINDO IMAGENS
Para inserir imagens use a seguinte notação:
(1) Arquivos de imagens que estão no mesmo diretório:
Ex.
(2) Arquivos de imagens que estão em diretórios diferentes:
Ex.
(3) Arquivos de imagens externos:
Para inserir imagens use a seguinte notação:
(1) Arquivos de imagens que estão no mesmo diretório:
Exemplo:
(2) Arquivos de imagens que estão em diretórios diferentes:
Exemplo:
(3) Arquivos de imagens externos:
Moldura em imagens
Use
Use
Dica: Use para uma descrição alternativa da imagem. Para usar uma imagem como link, sem borda, use < img src="imagem" border="0">
POSICIONANDO IMAGENS
Para definir a posição das imagens, usa-se 5 notações:
(1) Imagem à esquerda:
posiciona a imagem à esquerda do texto:
BorboletaTexto com imagem
alinhada à esquerda
(2) Imagem à direita:
posiciona a imagem à direita do texto:
BorboletaTexto com imagem
alinhada à direita
(3) Texto alinhado ao topo da imagem:
BorboletaTexto no topo da imagem
(4) Texto alinhado ao rodapé da imagem:
BorboletaTexto no rodapé da imagem
(5) Texto alinhado ao centro da imagem:
BorboletaTexto no centro da imagem
INFORMAÇÕES DE RODAPÉ
Para inserir seu endereço na página, utilize a seguinte marcação:
Coloca-se no endereço o nome do autor do documento e o endereço para contato.
COMO INSERIR SEU EMAIL
Para inserir o endereço eletrônico usa-se a URL e a notação mailto.
A URL indica para onde deve ir a mensagem. A notação mailto abre o programa de correio configurado no seu navegador.
A sintaxe para o link de endereço eletrônico é:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Exemplo:
O meu endereço eletrônico é [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Para inserí-lo em minha página usei a seguinte notação:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Para usar uma imagem como link para seu email, use a seguinte notação:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Não se esqueça de alterar o texto [Tens de ter uma conta e sessão iniciada para poderes visualizar este link] pelo seu login e pelo nome do seu provedor de email, bem como alterar "imagem.gif pelo nome de sua imagem.
INSERINDO BARRAS
Para inserir barras horizontais basta utilizar a seguinte tag:
. Esta tag é ímpar e não possui par.
Para exibir uma barra normal, use:
Grossura das Barras
Para exibir barras mais grossas, use o termo size (volume) em conjunto com a tag
Largura das Barras
Para controlar a largura das barras use a palavra width e a porcentagem com o sinal de igual. Exemplo:
Alinhando as Barras
Para alinhas as barras use as palavras Left, Right ou Center para alinhar à esquerda, à direita ou centralizar a barra. Exemplo:
Barras Animadas
Para inserir barras animadas (imagens gifs) use a sintaxe de inserção de imagens:
TAGS ESPECIAIS
As notações presentes em marcações, devem ser representadas com notações especiais para que possam ser exibidas na tela. Estas notações especiais sempre se iniciam por & (E comercial) e encerram-se com ; (ponto e vírgula).
Notação
Descrição
Aparência
<
Maior que
>
>
Menor que
<
&
E comercial
&
"
Aspas duplas
"
®
Marca registrada
®
©
Copyrights
©
É possível utilizar padrões de acentuação do Windows em documentos HTML, no entanto apenas poderá visualizar a acentuação o computador que reconhecer este padrão específico.
Para permitir a visualização de caracteres das marcações, por um grande número de máquinas, use o padrão ISO-Latin Alphabet, conforme tabela abaixo:
Caracter
Notação
Acento agudo
&xacute; onde x é uma letra qualquer, maiúscula ou minúscula
Acento grave
&xgrave; onde x é uma letra qualquer, maiúscula ou minúscula
Acento circunflexo
◯ onde x é uma letra qualquer, maiúscula ou minúscula
Letra com til
&xtilde; onde x é uma letra qualquer, maiúscula ou minúscula
Letra com trema
&xuml; onde x é uma letra qualquer, maiúscula ou minúscula
Cedilha
Ç = Ç ou ç = ç
Letras unidas
&Aelig; = Æ ou æ = æ
Letra com argola
Å = Å ou å = å
N com til
Ñ = Ñ ou ñ = ñ
O cortado
Ø = Ø ou Ø = ø
Fonte: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]