Como criar uma linha horizontal em HTML

Escrito por eric tilden | Traduzido por marina pastore
  • Compartilhar
  • Tweetar
  • Compartilhar
  • Pin
  • E-mail
Como criar uma linha horizontal em HTML
Screen shot de uma página web completa (All images are screen shots created by Eric Tilden)

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 <u></u>, 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.

Nível de dificuldade:
Fácil

Outras pessoas estão lendo

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

Lista completaMinimizar

Instruções

  1. 1

    Digite o seguinte entre as tags <body></body>, como mostrado: <h1>Meu documento</h1>

    Estabeleça um cabeçalho para o seu documento, usando as tags <h1></h1>. 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.

    Como criar uma linha horizontal em HTML
    Passo 1
  2. 2

    Digite a tag de linha horizontal, como mostrado: <hr />

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

    Como criar uma linha horizontal em HTML
    Passo 2
  3. 3

    Adicione o atributo "align" e defina-o como "left", conforme indicado: <hr align="left" />

    Como criar uma linha horizontal em HTML
    Passo 3
  4. 4

    Adicione o atributo "size" e defina-o como "4", como mostrado: <hr align="left" size="4" />

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

    Como criar uma linha horizontal em HTML
    Passo 4
  5. 5

    Adicione o atributo "width" e defina-o como "370", conforme indicado: <hr align="left" size="4" width="370" />

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

    Como criar uma linha horizontal em HTML
    Passo 5
  6. 6

    Adicione o atributo "color" à linha horizontal e defina-o como "maroon", conforme mostrado: <hr align="left" size="4" width="370" color="maroon" />

    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 "#".

    Como criar uma linha horizontal em HTML
    Passo 6
  7. 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.

    Como criar uma linha horizontal em HTML
    Página web pronta

Dicas & Advertências

  • A tag é 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.

Não perca

Filtro:
  • Geral
  • Artigos
  • Slides
  • Vídeos
Mostrar:
  • Mais relevantes
  • Mais lidos
  • Mais recentes

Nenhum artigo disponível

Nenhum slide disponível

Nenhum vídeo disponível