×
Loading ...

Como criar uma linha horizontal em HTML

Atualizado em 17 abril, 2017

Linhas horizontais permitem que o editor Web separe áreas da página em seções menores e mais digeríveis, dirigindo assim o usuário para focar no que é apresentado. Diferentemente da tag de sublinhado , a linha horizontal não é ligada ao texto acima ou abaixo dela. Ela também pode ser posicionada à esquerda, à direita ou no centro e pode ser de qualquer cor, espessura ou altura que o editor escolher. Este tutorial ensina a criar uma linha horizontal marrom, grossa e alinhada à esquerda, que separa o título principal do corpo do documento, que está em branco.

Instruções

Screen shot de uma página web completa (All images are screen shots created by Eric Tilden)
  1. Digite o seguinte entre as tags >, como mostrado:

    Meu documento

    Estabeleça um cabeçalho para o seu documento, usando as tags

    . Esta tag avisa os mecanismos de busca que as palavras entre elas são as mais importantes da página. Este cabeçalho será o título da página web, dando sentido ao uso de uma linha horizontal.

    Loading...
    Passo 1
  2. Digite a tag de linha horizontal, como mostrado:


    A tag de linha horizontal não tem uma tag final. Inclua um espaço e uma barra antes do sinal de maior.

    Passo 2
  3. Adicione o atributo "align" e defina-o como "left", conforme indicado:


    Passo 3
  4. Adicione o atributo "size" e defina-o como "4", como mostrado:


    O atributo "size" (tamanho) determina o quão espessa a linha é, em pixels.

    Passo 4
  5. Adicione o atributo "width" e defina-o como "370", conforme indicado:


    O valor do atributo "width" (largura) determina o quão longa a linha é, em pixels.

    Passo 5
  6. Adicione o atributo "color" à linha horizontal e defina-o como "maroon", conforme mostrado:


    A cor desta tag pode ser definida como qualquer cor padrão ou hexadecimal que você escolher. A cor hexadecimal deve ser precedida de um sinal "#".

    Passo 6
  7. Salve o documento e envie-o ao seu servidor. Abra seu browser e localize a página. Ela deve ter a linha horizontal marrom sob o título do documento.

    Página web pronta
Loading...

Aviso

  • A tag <hr /> é obsoleta, e a W3Schools encoraja o uso de imagens modificadas de pixels únicos, empregando instruções de folhas de estilo para alongar ou elevar as linhas até o tamanho desejado.

O que você precisa

  • Editor de texto, como o Source Edit (ver Recursos)
  • Software para envio de documentos, como o FileZilla (ver Recursos)
  • Espaço em um servidor

Referências

Recursos

Loading ...
Loading ...