Criação de um modelo de HTML ajuda a construir rapidamente páginas futuras de um site. Copie o código do modelo e colá-lo no editor para criar uma nova página. Usando divs significa que você pode facilmente mudar o layout do seu site , editando um arquivo: o arquivo CSS , que controla o layout das divs em todo o site inteiro . Coisas que você precisa editor HTML /CSS de sua escolha Show Mais instruções 1
Crie um arquivo HTML em um editor de sua escolha . < Br > 2
insira o seguinte código HTML, que cria a estrutura de sua página e inclui um link para o arquivo CSS. (O arquivo CSS será criada em um estágio posterior . )
Layout 1
Adicione um título de sua escolha para substituir o texto "Layout 1".
3
Adicione as seguintes " divs " entre as tags "
" .
Header
id="navigation">
Navegação
< /div >
conteúdo
id="footer">
Rodapé
< /div >
Este é um layout típico de uma página web. A " cabeça" refere-se ao topo da página ; do menu está situado por baixo . O conteúdo principal de cada página individual vai para a seção "Conteúdo" , ea seção " Rodapé" normalmente abriga o menu inferior em uma página web. Cada seção tem uma identificação que é usado pelo arquivo CSS para se referir a cada um dos elementos e colocá-lo na seção apropriada da página. 4
Salve a página . ( Certifique-se de que ele é salvo como um arquivo " . Html " . ) 5
Crie um novo arquivo " . Css" . 6
Insira o código do layout para o global documento e , em seguida, adicionar e manipular a fonte ea cor do fundo usando o seguinte código: margem
* {
: 0;
padding: 0;
}
body {
background: # eeeeee ;
font-family: sans -serif ;
font- size: 12px ;
} 7
Adicione o estilo para a div cabeçalho, que vai definir a altura ea cor : altura
div # header {
: 160px ;
background: # 800000 ; }
8
definir o estilo para os outros elementos div da página: a " navegação " , o " conteúdo" e o " rodapé " :
div # { navegação
background: white ;
width: 25%;
float: left ;
}
div # content {
margin: 0 25%;
background: # BDBD00 ;
}
div # footer {
background: # 800000 ;
width: 100 %;
claro : left; }
9
Salve o arquivo como " MyName.css " . 10
Teste a página em um navegador , abrindo a página HTML que você acabou de criar . Copie o código HTML e adicionar conteúdo aplicável para criar cada nova página de seu site.
