CSS tem uma sintaxe própria, a veremos através de exemplos. Em seguida, veremos com detalhes.

Vamos agora descrever os diferentes usos das CSS introduzidos no capítulo anterior. Vamos por ordem descrevendo os pontos segundo sua dificuldade e importância.

Dividimos este capítulo em duas partes por sua extensão e por haver várias formas distintas de aplicar estilos. Aqui veremos as mais simples e no capítulo seguinte outras mais complicadas, mas mais potentes.

Pequenas partes da página

Para definir estilos em seções reduzidas de uma página se utiliza a etiqueta <SPAN>. Com seu atributo style indicamos em sintaxe CSS as características de estilos. Vemos com um exemplo, colocaremos um parágrafo onde vamos visualizar determinadas palavras na cor verde

<p> Isto é um parágrafo com várias palavras <SPAN style="color:green">de cor verde</SPAN>. é muito fácil. </p>

Que tem como resultado:

Isto é um parágrafo com várias palavras de cor verde. É muito fácil.

Estilo definido para uma etiqueta

Deste modo podemos fazer com que toda uma etiqueta mostre um estilo determinado. Por exemplo, podemos definir um parágrafo inteiro de cor vermelha e outro de cor azul. Para isso, utilizamos o atributo style, que é admitido por todas as etiquetas do HTML (sempre e quando dispormos de um navegador compatível com CSS).

<p style="color:#990000"> Isto é um parágrafo de cor vermelha. </p> <p style="color:#000099"> Isto é um parágrafo de cor azul. </p>

Que tem como resultado:

Isto é um parágrafo de cor vermelha.

Isto é um parágrafo de cor azul.

Estilo definido em uma parte da página

Com a etiqueta <DIV> podemos definir seções de uma página e aplicar estilos com o atributo style, ou seja, podemos definir estilos de uma só vez a todo um bloco da página.

<div style="color:#000099; font-weight:bold"> <h3>Estas etiquetas vão em <i>azul e negrito</i></h3> <p> Continuamos dentro do DIV, por isso permanecem os estilos. </p> </div>

Que tem como resultado:

No próximo capítulo seguiremos vendo formas mais avançadas de usar as CSS.