Ir para conteúdo / Skip to content

GUIA CSS - 3ª PARTE: UTILIZANDO CLASSES

blog reactions Postado em: 10 de julho de 2006 por Pedro Rogério

Os seletores de classe permitem que você determine diversos estilos dentro de um mesmo elemento (x)HTML. Ele é similar aos estilos inline. As classes podem seu usadas diversas vezes dentro de um arquivo (x)HTML, diferentemente do ID, que só pode ser usado uma vez, mas isso veremos em um próximo artigo. Para um melhor entendimento vamos a um exemplo, eu gerei uma definição para um parágrafo:


p {
   font-size:1.6em;
   color:#F00;
}

Tudo bem, mas eu quero que uma parte do meu parágrafo fique em verde e negrito, aí é que iremos usar uma classe, então, vamos criar a mesma:


.boldgreen {
  color: #008080;
  font-weight: bold;
}

Para uma melhor compreensão, veja um exemplo em funcionamento. Como você pode reparar, os seletores de classe começam com (.), e quanto ao nome das mesmas, elas ficam ao seu critério.

Tradução do artigo original de: CSS Basics.

Deixe seu comentário

2 comentários para esse post

  1. GUIA CSS - 4ª PARTE: UTILIZANDO IDs » Pinceladas da Web disse:
    #1

    [...] Os seletores de ID são semelhantes as classes, mas há uma diferença, eles só podem seu usados uma única vez em uma página (x)HTML. Seu uso geralmente é denominado para elementos de disposição da página, que geralmente são usados uma única vez, e os seletores de classe ficam a cargo de estilizar o resto de nossa página. [...]

  2. GUIA CSS - 4ª PARTE: UTILIZANDO IDs » Pinceladas da Web - Reflexões sobre XHTML, CSS, PHP e WebStandards disse:
    #2

    [...] seletores de ID são semelhantes as classes, mas há uma diferença, eles só podem seu usados uma única vez em uma [...]

Deixe seu comentário