HTML
Dicas de Uso para a Construção de Páginas Web

Links Parágrafos

As folhas de estilo podem ser aplicadas em várias situações dentro de seu site. A seguir mostraremos alguns exemplos, bem práticos, os quais esperamos que ajudem, a cada um de nossos visitantes, a incrementar o visual de suas próprias páginas, ou pelo menos a diminuir o tamanho do código fonte de suas páginas.

Esta lição permanecerá em aberto para novas idéias. Se você conseguiu aplicar CSS usando comandos e parâmetros aqui não citados, e quiser compartilhar sua experiência, envie um e-mail para nós, que publicaremos sua contribuição aqui.

FORMATANDO LINKS

Uma das mais utilizadas aplicações de CSS é para alterar a formatação básica dos links dentro de uma página.

A sintaxe mais comum desse método é a seguinte:

<STYLE TYPE="text/css"> <!- A:link {COLOR: red; text-decoration: none;} -> </STYLE> Exemplo:  Veja este Link   o link está na cor VERMELHA (COLOR: RED) e não há o sublinhado tradicional (TEXT-DECORATION: NONE)

Veja mais uma variação desse mesmo tema:

<STYLE TYPE="text/css"> <!- a:link {color: #800000; font-size: 8pt; text-decoration: none;} a:hover {color: #800080; font-weight: bold;} -> </STYLE> Exemplo:  Veja este Link  (coloque o cursor em cima e veja o efeito) o link está na cor #800000 quando o cursor não está sobre ele e sem o sublinhado tradicional, e se altera para a cor #800080 quando o cursor está SOBRE o link, com o aparecimento do sublinhado tradicional, e a alteração do "peso" da fonte, agora em negrito

topo

FORMATANDO PARÁGRAFOS

Uma utilidade interessante é na formatação dos parágrafos, ou de um apenas, para destacá-los dos demais, ou deixar o padrão de sua página diferente do padrão que os browsers entendem (no caso Times New Roman, tamanho Normal)

A sintaxe mais comum desse método é a seguinte:

<p style="font-size:10pt; font-family:Arial; font-style:italic; color:navy;">  Exemplo:  Este parágrafo, e somente este parágrafo, está formatado com fonte Arial, 10 pontos em estilo itálico, com a fonte na cor NAVY (ou #000080). Assim que este parágrafo terminar tudo volta ao normal (definido para o restante da página). Para obter este efeito você tem que usar o MÉTODO IN-LINE (como indicado no exemplo), pois se definir com o método EMBEDDING o efeito será sobre TODOS os parágrafos da página.

Mas se você desejar que todo os parágrafos de uma página fiquem formatados desse modo, a sintaxe é a seguinte:

<STYLE TYPE="text/css"> <!- P { font-size: 10pt; font-family: Arial; font-style: italic; color: #000080; } -> </STYLE> Lembre-se de colocar este comando na seção HEAD de sua página...

topo

É importante que você teste por si mesmo estes exemplos numa página nova, onde possa fazer diversas experiências, variando parâmetros, acoplando outros estilos, sem prejudicar uma página real de seu site.