Passo 3 - Aparencia

Barra Animada

 

Apresentação

Até agora haviamos produzido um documento bem simples. Porém algumas providencias podem melhorar e muito a aparencia de seu site.

 

Alinhamento

A primeira providencia para melhorar a aparencia de seu site é modificar o alinhamento do texto. Para isso deve-se utilizar o atributo ALIGN dentro dos tags que marcam os paragrafos ( <h1>, <h2> <p> etc )

Exemplo

<html>
<head>
<title> Alinhamento </title>
</head>

<body>
<h1 align=center > Paragrafo alinhado </h1>
<p align=center > Esse é um paragrafo centralizado </p>

</body>
</html>

Veja com ficou

 

Margens

Para se fazer margens utilizam-se as tags </blockquote> que funciona mais ou menos com a tecla tab em processadores de texto. Se vc quiser mais espaço pode repetir a tag.

Exemplo:

 

<html>
<head>
<title> Alinhamento </title>
</head>

<body>
<h1 align=center > Margens </h1>
<blockquote> Texto com margem </blockquote>
<blockquote><blockquote>Texto com mais margem</blockquote></blockquote>

</body>
</html>

Veja como ficou

 

Estilo de caracteres

Para se dar enfase a determinados paragrafos pode-se utilizar negrito e italico. Para negrito deve-se utilizar as tags <b> e </b> e para italico <i> e </i>

exemplo

<html>
<head>
<title> Alinhamento </title>
</head>

<body>
<h1 align=center > Margens </h1>
<b> Texto em Negrito </b><p>
<i> Texto em italico </i> <p>

</body>
</html>

Ver como ficou

Cores diferentes

Para se mudar a cor de fundo da janela utlizan-se os tags "<bgcolor>" e para mudar a cor do texto os tags <text>

 

<html>
<head>
<title> Alinhamento </title>
</head>

<body bgcolor=red text=black>
<h1 align=center > Cores </h1>
<font color=blue> texto azul </font>

</body>
</html>

Veja como ficou

Proximo Exemplo
Imagens