Como tornar seu site adequado a diferentes tamanhos de tela

Saiba como tornar seu website adequado ao tamanho da tela da pessoa que o visualiza.

Passo 1

Clique em "Arquivo" e depois em "Abrir" para abrir sua página da Web em um editor de texto. Escolha sua página da web no menu.

Passo 2

Localize a tag HEAD em sua página da web procurando pelas tags HTML e próximo ao topo da sua página da web.

Passo 3

Adicione os seletores de tags CSS logo acima do marcador dentro de STYLE. Esse pode ser o seletor "Body" ou um ID DIV ou um contêiner de Classe se você quiser que o conteúdo seja separado do plano de fundo do site. Por exemplo: "body {}" ou "#container {}". Você pode adicionar ambos para controlar o tamanho dos dois elementos. Dentro do STYLE, ambos os artigos devem ter esta aparência:

Passo 4

Adicione a propriedade width com uma porcentagem. Por exemplo, se você quiser que o corpo cubra toda a área da janela, você terá que dar uma largura de 100%. Se você quiser que o contêiner tenha uma margem que mostre a parte inferior, você pode dar um valor de 80%. Usando o exemplo acima, o código seria "body {width: 100%;} #container {width: 80%;}".