Como centralizar minha página web

O HyperText Markup Language (HTML) é ótimo para colocar para fora a estrutura de uma página web, mas se você quiser adicionar um pouco de estilo ao layout, mais cedo ou mais tarde você vai encontrar-se abraçando o poder e elegância de Cascading Style Sheets (CSS). CSS irá permitir-lhe o estilo quase tudo que você pode imaginar em uma página da web - e é frequentemente muito mais fácil do que você pensa. Com CSS, centrando-se uma página web inteira pode ser realizado com apenas algumas linhas curtas de código.

Coisas que você precisa

  • editor de texto ou HTML
  • Abra a página web em um editor de texto ou um editor de páginas da web que permite editar HTML diretamente.

  • Coloque o corpo de sua página dentro de uma tag DIV. Como o objetivo é centralizar toda a página web, este deve ser apenas sobre tudo dentro da tag BODY. Coloque o

    tag imediatamente após a tag e colocar o fechamento
    etiquetar pouco antes da marca de fechamento.

  • Dê o

    marcar uma ID de modo que as informações de estilo pode ser atribuído a ele. Este artigo vai assumir que é chamado "página," para que o seu código deve ser algo como:
    .

  • Criar um link para o arquivo CSS que contém as instruções de estilo para a página. Não se preocupe se você não tem um arquivo CSS ainda. Você terá a chance na próxima etapa.

    Na secção HTML CABEÇA (entre o e Tag), adicione um link para a sua folha de estilo usando . Certifique-se os href aponta para o local adequado e nome da sua folha de estilo. Você também pode usar uma URL completa aqui se você quer ser muito específico.



  • Criar uma folha de estilo (CSS) arquivo se você ainda não tem um que você está usando para esta página. Isso não é nada mais do que um arquivo de texto simples e você pode nomeá-lo o que quiser, mas é recomendável que você dá a ele uma extensão .css. O nome do arquivo deve corresponder ao local de folha de estilo que você colocar na seção HEAD da sua página web.

  • Abra seu arquivo CSS e definir o estilo para o ID DIV em torno de seu conteúdo. Se o ID do tag DIV é "página," em seguida, o código ficaria assim:

    página {

    margin-left: auto
    IR
    margin-right: auto
    IR
    }

    Se você quiser especificar as margens superior e inferior, também, então você pode encurtar este ainda mais usando o seguinte:

    página {

    margin: 0 auto 0 auto
    IR
    }

    Isto lhe daria uma margem superior de 0px, margem direita "auto," margem inferior 0px ea margem esquerda do "auto" respectivamente.

  • Salve o arquivo e, em seguida, recarregar a página no seu navegador para confirmar que ele está centrado. Se as coisas não estão centrados corretamente, certifique-se de tudo que você quer centrado está entre as tags DIV criados anteriormente e que o link para seu folha de estilo está apontando para o local correto.

dicas & avisos

  • Embora seja completamente aceitável para colocar as informações de estilo CSS diretamente no código HTML da página, você vai achar que é muito mais eficiente para manter os dados em um arquivo separado que não só permite que você se concentrar em estilo e HTML separadamente, mas também reutilizar as informações de estilo em várias páginas sem ter que recriá-lo o tempo todo.
De esta maneira? Compartilhar em redes sociais:

LiveInternet