CSS: Agrupamento (id, classes e seletores)

Publicado em: 15 de janeiro de 2009Categoria: CSSTag(s): ,
    Obrigado! você é a 1.366ª pessoa que visita este post.

    Sempre quando queremos agrupar id, classes e seletores é aquela dificuldade para lembrar da sintaxe correta. Então decidi, levantar as formas possíveis de fazer isso e publicar para todos.

    1º. id e classe

     
#id_deslocamento
{
     padding-left:10px;
}
#id_deslocamento .classe
{
     color:#ff0000;
     font-size:14px
}

    2º. id e seletores
    » arquivo .css

    #top
{
     background-color: #ccc;
     padding: 5px
}
#top h1
{
     color: #ff0;
}
#top p
{
     color: red;
     font-weight: bold;
}

     
    » arquivo .html

    <div id="top">
     <h1>Título da Página</h1>
     <p>Neque porro quisquam est qui, consectetur, adipisci velit...</p>
</div>

    3º. classes e links

    1. a:link……..link no estado inicial
    2. a:visited…link visitado
    3. a:hover…..link quando passa-se o mouse sobre ele
    4. a:active….link ativo (no momento em que é dado o clique)
    .classe a:link, .classe a:visited, .classe a :active
{
   text-decoration: none; 
   color: #FF0000
}
.classe a:hover
{
   border-bottom: #000 1px solid
   color: #000;
   font-weight: bold;
}

    outra forma:

    a.classe:link {color: #009900}
a.classe:visited {color: #FF0000}
a.classe:hover {color: #333333}
a.classe:active {color: #00FFFF}

    No related posts.