Autor: Mariana Costa | Publicado: 2013-01-20T18:41:00-08:00


HTML - Listagem de comandos


Título do documento:

 escreva aqui o titulo da pagina Ou seja, escreva&nbsp; no início do título e &nbsp;para avisar que já terminou o título.
Evite usar acentuação dentro do&nbsp;title&nbsp;pois é o gerenciador de janelas (window manager) quem interpreta o&nbsp;title&nbsp;e não o software de navegação e muitas vezes o gerenciador de janelas não suporta caracteres acentuados.
O título deve ser o mais explicativo possível porem, compacto (no máximo uma linha).


Cabeçalhos (Headers):
Cabeçalhos podem ser usados em qualquer parte da página em HTML para dar destaque maior ou menor a algum termo do texto. Existem 6 tamanhos de cabeçalhos e eles são usados da seguinte forma:
 . . . 

Cabeçalho H1

 . . . 

Cabeçalho H2

 . . . 

Cabeçalho H3

 . . . 

Cabeçalho H4

 . . . 

Cabeçalho H5

 . . . 

Cabeçalho H6


Tipos de letra:
Itálico&nbsp;(Exemplo de texto em itálico): . . . Bold (Exemplo de texto em bold):
 . . . Code&nbsp;(Exemplo de texto em "code"):
 . . . Blink&nbsp;(Letras piscando):
 . . . 


Listas:

Criando uma lista de elementos tipo "ul" (Unordered List):
O exemplo:
Exemplo
de lista
não ordenada

Foi criada com o comando  . . . 
(que afasta todo o conteúdo para a direita) combinado com o comando
 (cria uma marca na frente de cada item), escrito da seguinte forma:


 Aqui vai um item da lista

 Aqui vai o proximo item.

 E pronto.

Criando uma lista de elementos tipo "ol" (Ordered List):

Exemplo
de lista
ordenada.

A diferença da lista tipo "ul" é que neste caso cada item possui um número na sua frente, colocado automaticamente por cada
 encontrado.


 Aqui vai um item da lista

 Aqui vai o proximo item.

É possível combinar listas "ol" e "ul" e também criar listas dentro de listas como no caso:


Item A
Um sub-item do A
Outro sub-item do A


Item B
Item C



Formatando o texto na página:
Ao escrever um texto em HTML, a formatação (espaços entre uma palavra e outra e distância entre uma linha e outra) não é interpretada, ou seja, é preciso incluir comandos de quebra de linha, parágrafo e de texto pré-formatado como os que seguem:Termina uma linha de texto (pula para próxima linha):Termina um parágrafo (pula duas linhas):Para pular várias linhas, não adianta usar diversos  seguidos. O que pode ser feito para pular diversas linhas é usar o comando , seguido de alguns "Enter" e depois o comando 
para terminar.
Colocando um texto pré-formatado:
 coloque o texto aqui 
Exemplo de texto pré-formatado:              "Este   é   um texto
                           pre-formatado."

Normalmente a apresentação de um texto formatado pelo comando&nbsp;pre&nbsp;é pior do que a de um texto formatado pelos comandos de formatação do HTML.Iniciando um parágrafo de texto:
Este comando&nbsp;&nbsp;afasta a primeira linha do texto que vem a seguir dele um pouco para a direita.
Interpretando o HTML como se fosse texto puro (.txt):
Deste comando para frente tudo é interpretado como texto puro, ignorando os comandos do HTML, mostrando os comandos junto com o texto.
Centralizando textos e imagens:

 . . . 



Criando linhas de separação:
O comando&nbsp;
&nbsp;cria uma linha horizontal em uma página e pode ser utilizado com alguns atributos:
Onde a largura pode ser definida em pixels (width=100 por exemplo) ou em porcentagem do tamanho horizontal da tela (width=30% por exemplo).
Exemplo:
cria uma linha com 8 pixels de altura, com largura igual a 50% do tamanho da tela, alinhada à direita, como a seguinte:

Uma linha mais sólida pode ser criada usando o atributo&nbsp;noshade&nbsp;junto com o&nbsp;hr, como no exemplo:
Gera a linha:




Diversos:
Colocando comentários no HTML:<!-- . . . -->Exemplo:<!-- este texto não aprecerá na página -->


Colocando imagens dentro da tela:
As imagens que aparecem nas páginas da WWW podem estar no formato GIF ou JPEG. O formato JPEG não é compatível com todos os programas de acesso e pode resultar em perda de qualidade na imagem, porém, costuma ser de menor tamanho (em kbytes) do que o formato GIF.O comando para colocar uma imagem é:
Sendo "imagem" o nome da imagem ou o endereço onde ela se encontra.
Exemplos:
Inclui uma imagem chamada "tela.gif"
Busca a imagem "tela.gif" dentro do diretorio "images"
Busca a imagem "lsi2.gif" no endereço "www.lsi.usp.br", dentro do diretório "icones"
Alguns parâmetros podem ser utilizados com o&nbsp;img src:
Alinhamento:
Os tipos possíveis para "alinhamento" são:


align="right"Posiciona a imagem à direita da tela.

align="left"Posiciona a imagem à esquerda da tela.