Como formatar sites

Um site eficaz deve transmitir conteúdo para seus leitores através de formatação atraente. A má formatação pode tornar um site pouco atraente ou mesmo ilegível. Com Hypertext Markup Language (HTML), você pode controlar a formatação de um site para que ele apareça exatamente como você deseja. Além disso, as Folhas de Estilo em Cascata (Cascading Style Sheets - CSS) permitem que você formate um site usando uma folha de estilo externa. Essa técnica é útil se você deseja aplicar o mesmo estilo a várias páginas do seu site.

Formatação HTML

Crie tabelas para posicionar os vários elementos da sua página da Web. Use um

tag para iniciar a própria tabela. Use um tag para iniciar uma linha da tabela e

tag para criar uma célula de dados da tabela na linha. Geralmente, as células de dados da tabela podem ser consideradas como as colunas de uma tabela. Para posicionar adequadamente seus elementos, experimente os parâmetros de altura, largura, preenchimento e espaçamento de linhas individuais e células de dados.

Adicione efeitos de texto e estilos de fontes nas tags de elementos que contêm o texto. Por exemplo, se você deseja formatar o texto dentro de um elemento de parágrafo:

Isso renderiza o conteúdo do parágrafo na fonte Comic Sans.

Adicione um plano de fundo a todo o seu website na tag usando o atributo bgcolor. Por exemplo:

Isso renderiza o plano de fundo de toda a página em uma cor rosa.

CSS e folhas de estilo externas

Abra um novo documento de texto no bloco de notas.

Formate cada elemento dentro do novo documento. Use a tag de elemento seguida por um colchete aberto para introduzir estilos para esse elemento. Por exemplo:

p {

font-family: "comic sans ms";

background-color :: # CC3366;

}

Cada parágrafo em seu documento HTML terá a fonte Comic Sans e terá uma cor de fundo rosa.

Use um ID ou classe se você deseja introduzir estilos que serão usados em vários tipos diferentes de elementos ou em casos individuais. Um ID só pode ser usado uma vez e é introduzido pelo símbolo "#". Uma classe pode ser usada várias vezes e é denotada por "." símbolo. Por exemplo:

.comicrose {

font-family: "comic sans ms";

background-color :: # CC3366;

}

Esta classe permite que você estilize um elemento com Comic Sans e um fundo rosa onde quer que você chame sua classe. Por exemplo, no código HTML da sua página,

estilos um parágrafo conforme descrito.

Vincule a uma folha de estilos externa na seção do seu código HTML. Por exemplo:

Isso vincula a uma folha de estilos externa chamada pagestyles.css.