Para além das tags HTML que podemos formatar em CSS, podemos adicionar dentro delas class e id. Podendo expandir as formatações das tags HTML para indefinidas personalizadas.

Um id é um identificador único, pelo que não pode ser repetido na mesma página (com o mesmo nome). E em CSS é identicado com um cardinal: #nome_do_id. Exemplo:

1. <div id="menu">
2. <ul>
3. <li><a href="link1.html">Link 1</a></li>
4. <li><a href="link2.html">Link 2</a></li>
5. <li><a href="link3.html">Link 3</a></li>
6. </ul>
7. </div>

o id="menu" não poderá ser repetido na mesma página. Mas id's com outros nomes já podem aparecer. As classes são semelhantes aos id's mas não têm limite de repetição e é possível agrupar várias classes. Em CSS as classes são identificadas com um ponto: .nome_da_class

1. Gerou-se um <span class="aviso">erro</span>!

Nos exemplos usei o id com um div e a class com o span mas class e id podem ser utilizadas noutros elementos.

Em CSS vamos dar estilos a estas classes e ids, vão ficar em conjunto. Como no id, utilizámos listas, vou adicionar vários exemplos de selectores.

1. #menu { margin: 10px; background-color: #00ccff; width: 150px; }
2. #menu ul li { list-style: square; padding: 5px 15px; }
3. #menu ul li a { text-decoration: underline; font-style: italic; }
4. #menu ul li a:hover { text-decoration: line-through; }
5. .aviso { color: #ff0000; font-weight: bold; }

Este post foi escrito em Sunday, February 18th, 2007 às 6:25 pm e encontra-se na categoria CSS. Podes seguir qualquer comentário a esta entrada a partir dos RSS 2.0 feed. Podes deixar um comentário, ou trackback do teu próprio site.