Notícias CSS, Desenvolvimento Web, Front-End Rodrigo Dias 30/12/2010

Seletores CSS

Em CSS, seletores são padrões usados para selecionar o elemento (s) que deseja estilo.
O “CSS” coluna indica a versão na qual CSS a propriedade é definida (CSS1 ou CSS2).

Selector	Exemplo	Exemplo Seleciona:	CSS
. classe	.intro	Todos os elementos com a classe “intro”	1
# id	#firstname	O elemento com id = “nome”	1
*	*	Todos os elementos	2
elemento	p	Todos os elementos <p>	1
elemento, o elemento	div,p	Todos os elementos <div> e todos os elementos <p>	1
elemento elemento	div p	Todos os elementos dentro de elementos <p> <div>	1
elemento > elemento	div>p	Todos os elementos <p> onde o pai é um elemento <div>	2
elemento + elemento	div+p	Todos os elementos <p> colocado imediatamente após um elemento <div>	2
[ atribuem ]	[target]	Todos os elementos com um atributo target	2
[ atributo = valor ]	[target=_blank]	Todos os elementos com um atributo target igual a “_blank”	2
[ atributo ~ = valor ]	[title=flower]	Todos os elementos com um atributo de título que contém palavras separadas por espaços, um dos quais é a “flor”	2
[ atributo \| = língua ]	[lang\|=en]	Todos os elementos, onde o valor do atributo lang é “en”, mesmo se o valor contiver um hífen (-), como “en-us”	2
: Link	a:link	Todos os links (<a> elementos com href)	1
: Visited	a:visited	Todos os links visitados	1
: Ativo	a:active	Links ativos	1
: Hover	a:hover	Links sobre o mouse sobre o	1
: Foco	input:focus	O elemento de entrada que tem o foco	2
: First-letter	p:first-letter	A primeira letra de todos os elementos <p>	1
: First-line	p:first-line	A primeira linha de todos os elementos <p>	1
: First-child	p:first-child	Todos os elementos <p> que é o primeiro filho de seu pai	2
: Antes	p:before	O conteúdo será colocado antes de cada elemento <p>	2
: Após	p:after	O conteúdo será colocado após cada elemento <p>	2
: Lang ( linguagem )	p:lang(it)	Todos os elementos <p> com o atributo lang com “ele”	2