Olá! Saturday, 20 de April de 2024.
- Códigos
- Assistentes
- Artigos/Dicas
- Widgets
- Serviços
- Expediente
- Parceiros
Adicionar a Meu favorito
Sunday, 15 de February de 2004
Agrupamento de seletores CSS
Agrupamento de Seletores
Uma regra CSS quando válida para vários seletores, estes podem ser agrupados.
Separe cada seletor com uma vírgula. No exemplo abaixo agrupamos todos os elementos cabeçalho. A cor de todos os cabeçalhos será verde.
h1, h2, h3, h4, h5, h6 {color: #00FF00;}
O seletor classe
Mas você não está restrito somente aos elementos HTML (tags) para aplicar regras de estilo!
Você pode "inventar" um nome e com ele criar uma classe a qual definirá as regras CSS. E o mais interessante das classes, é que elas podem ser aplicadas a qualquer elemento HTML.
E mais ainda, você pode aplicar estilos diferentes para o mesmo tipo de elemento do HTML, usando classes diferentes para cada um deles.
A sintaxe para o seletor classe é mostrada abaixo.
Elemento HTML mais um nome qualquer que você "inventa", precedido de . (ponto):
elementoHTML.minhaclasse { propriedade: valor;}
Nota: Para o nome que você "inventa" para sua classe, evite usar números e caractéres especiais. Tanto quanto possível use só letras de a-z e de A-Z. Números e caractéres podem ser usados, mas há restrições quanto ao seu uso.
Dica 1: Use só letras!
Por exemplo: suponha que você queira ter dois tipos de parágrafos em seu documento:
-um parágrafo com letras na cor preta e;
-um parágrafo com letras na cor azul.
p.corum { /* classe corum= preta */ color:#000000; } p.cordois { /* classe cordois= azul */ color:#0000FF; }
No seu seu documento HTML as regras seriam aplicadas conforme abaixo:
Dica 2: Classes definidas pelas regras CSS são ótimas para se aplicar estilos diferentes num mesmo elemento HTML (tag) em um mesmo documento.
Maurício Samy Silva
www.maujor.com
Um site dedicado as CSS
Uma regra CSS quando válida para vários seletores, estes podem ser agrupados.
Separe cada seletor com uma vírgula. No exemplo abaixo agrupamos todos os elementos cabeçalho. A cor de todos os cabeçalhos será verde.
h1, h2, h3, h4, h5, h6 {color: #00FF00;}
O seletor classe
Mas você não está restrito somente aos elementos HTML (tags) para aplicar regras de estilo!
Você pode "inventar" um nome e com ele criar uma classe a qual definirá as regras CSS. E o mais interessante das classes, é que elas podem ser aplicadas a qualquer elemento HTML.
E mais ainda, você pode aplicar estilos diferentes para o mesmo tipo de elemento do HTML, usando classes diferentes para cada um deles.
A sintaxe para o seletor classe é mostrada abaixo.
Elemento HTML mais um nome qualquer que você "inventa", precedido de . (ponto):
elementoHTML.minhaclasse { propriedade: valor;}
Nota: Para o nome que você "inventa" para sua classe, evite usar números e caractéres especiais. Tanto quanto possível use só letras de a-z e de A-Z. Números e caractéres podem ser usados, mas há restrições quanto ao seu uso.
Dica 1: Use só letras!
Por exemplo: suponha que você queira ter dois tipos de parágrafos em seu documento:
-um parágrafo com letras na cor preta e;
-um parágrafo com letras na cor azul.
p.corum { /* classe corum= preta */ color:#000000; } p.cordois { /* classe cordois= azul */ color:#0000FF; }
No seu seu documento HTML as regras seriam aplicadas conforme abaixo:
este parágrafo terá cor preta.
este parágrafo terá cor azul.
Dica 2: Classes definidas pelas regras CSS são ótimas para se aplicar estilos diferentes num mesmo elemento HTML (tag) em um mesmo documento.
Maurício Samy Silva
www.maujor.com
Um site dedicado as CSS
Enviar um Artigo
Enviado por: Emmanuel Alves
Comentários do artigo [Novo comentário]
juniorherenio
- 15 de August de 2009 - 16:05
<form name="nomedoform" action="xxxx"
method="xxxx" >
<table>
<tr>
<th colspan="2">Formul&aacute;rio de contato
</th>
</tr>
<tr>
<td><label for="nome">Nome</label></td>
<td><input name="nome" type=text size="33"
maxlength="1000"></td>
</tr>
<tr>
<td><label for="email">*e-mail</label></td>
<td><input name="email" type=text size="33"
maxlength="1000"></td>
</tr>
<tr>
<td><label for="assunto">Assunto</label></td>
<td><input name="subject" type=text size="33"
maxlength="1000"></td>
</tr>
<tr>
<td><label for="comentario">*Coment&aacute;rios</label></td>
<td><textarea name="comentario" cols="25"
rows="7" ></textarea></td>
</tr>
<tr>
<td><input name="submit" type="submit"
value="Enviar" class="botao"></td>
<td>* Campos de preenchimento obrigat&oacute;rio</td>
</tr>
</table>
</form>
method="xxxx" >
<table>
<tr>
<th colspan="2">Formul&aacute;rio de contato
</th>
</tr>
<tr>
<td><label for="nome">Nome</label></td>
<td><input name="nome" type=text size="33"
maxlength="1000"></td>
</tr>
<tr>
<td><label for="email">*e-mail</label></td>
<td><input name="email" type=text size="33"
maxlength="1000"></td>
</tr>
<tr>
<td><label for="assunto">Assunto</label></td>
<td><input name="subject" type=text size="33"
maxlength="1000"></td>
</tr>
<tr>
<td><label for="comentario">*Coment&aacute;rios</label></td>
<td><textarea name="comentario" cols="25"
rows="7" ></textarea></td>
</tr>
<tr>
<td><input name="submit" type="submit"
value="Enviar" class="botao"></td>
<td>* Campos de preenchimento obrigat&oacute;rio</td>
</tr>
</table>
</form>
Para adicionar um comentário você deve efetuar o login
b�blia
formulario php
marquee
visitas
cadastro de clientes'a=0
condominio
produtos
link
e-mail
cookie
mail
boletim
tempo
logi
status
galeria de imagens
cadastro de cliente
paginação
relatório
códigos para blogger
gr�ficos
compras
afiliados
uploa
php xls
form mail
sistema de noticia
valida
navegador
cadastro de clientes
 |
CodigoFonte.net » Meu Mural » Competiva - Criação de Sites » Todos os Direitos Reservados © 2002/2010 |
