CSS+Tableless no Dreamweaver - Parte 2

Arquivo de (Tableless/CSS) por Felipe Cardozo em 12-03-2008 - 4,798 visualizações

Tags: , , , ,

a a a

Olá!
Na segunda parte de CSS+Tableless no dreamweaver, vamos aprender regras de agrupamento de seletores, seletores classe e seletores ID. Esta regra é bastante utilizada para incluir uma formatação em mais de um seletor (elemento html, div, id, etc…). Esta vídeo aula é imprescindível para você tem uma maior idéia das características da CSS.

Assista à vídeo aula

Agrupamento de seletores


h1, h2, h3, h4, h5, h6  {

color: #990000;
font-size:12px;
font-family: Arial, "Times New Roman", Times, serif;
}
Qualquer forma de título entre o H1 até o H6 terá a formatação acima.

Seletores classe

elemento HTML.classe


p.classe1 {

color:#FF6600;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
}

Nota: Qualquer elemento HTML que esteja com o parágrafo (P) terá a formatação acima.

Leia mais e assista à vídeo aula:


.classe2 {
color:#003366;
font-size:10px;
font-family:Arial, Helvetica, sans-serif;
text-align:right;
}

Nota: Qualquer elemento HTML que for determinado por “Classe2″ terá a formatação acima.

EX:


<h1 class="classe2"> Título </h2> ou <p class= "classe2">

Seletor ID


#box1 {
background-color:#CCCC66;
border:#000000;
padding-top: 10px;
}

O conteúdo ficaria assim:



<div id="box1">

Aqui o conteúdo HTML que terá a formatação da "ID box 1"

</div>

Obs: O seletor ID difere do seletor classe por ser único e pode ser aplicado a um único elemento .

Comentários: