Parte 1
Começando a criar a planilha do nosso site
A página index.html que vimos até o momento não está terminada. Seu aspecto final não terá nada a ver com o que tem agora, mas trabalharemos sobre ela mais adiante. Agora o que vamos fazer é começar criando planilhas, que valerá para gerar a partir dela o resto de páginas do nosso site.
Criando o arquivo planilha.html
Lembra dos passos dados antes para criar o index.html, agora vamos a criar o arquivo planilha.html. Então vamos lá, certeza que você já sabe fazer isso... deixo abaixo algumas pistas:
- Abrir o Html-kit.
- Fazer que torne visível a janela Workspace.
- Colocar o ponteiro do mouse sobre “web-exemplo-css-local” e clicar com o botão direito do mouse.
- Escolher New > Create File...
- Escolher criar "Blank Html Page" desde a lingüeta "General" e pulsar em Ok.
- Por o nome de planilha.html e clicar Ok de novo.
Agora abrir fazendo doublé cilc no seu nome, na janela Workspace, para começar a trabalhar sobre ela. Como sempre quando criar um novo arquivo aparecerá quase vazio.
Criando a Folha de Estilos para o resto de páginas do site
Fazer o mesmo para criar uma folha de Estilos diferente da anterior. Enquanto que a anterior (estilos.css) nós deixaremos somente para o index, esta segunda Folha de Estilos chamaremos de “estilo-geral.css” e a usaremos para todas as outras páginas do site. Criar você mesmo. Se não lembra, clique no link: Como criar uma Folha de Estilos vazia; porém recordar de colocar como nome “estilo-geral.css”.
Relacionando estilo-general.css com planilha.html
Agora é hora de relacionar o que foi criado; esta segunda Folha de Estilos (estilo-geral.css) com a planilha.html. Lembra que tem que por uma linha de código…onde, onde, onde??? Se você pensou na cabeça ou head, acertou!!! Caso não recorda ou tenha ficado com alguma dúvida deixo um link aqui: Como relacionar a Folha de Estilos com o site; porém não esqueça de colocar como nome “estilo-geral.css” em lugar de “estilos.css”, beleza?
Planilha.html e estilo.geral.css estão na mesma pasta, portanto é suficiente escrever assim:
<link rel="stylesheet" href="estilo-geral.css" type="text/css" media="all">
Uma vez criados estes dois arquivos e relacionados entre si, passaremos a meter a mão neles.
Menu
