Seletor de Elemento do CSS

Seletor de Elemento do CSS

O seletor CSS mais comum é o seletor de elemento. Em outras palavras, os elementos do documento são os seletores mais básicos.

Quando se define estilos de HTML, o seletor geralmente será algum elemento HTML, como p, h1, em, a, até mesmo o próprio html:

html {color:black;}
h1 {color:blue;}
h2 {color:silver;}

Experimente você mesmo

Pode-se mudar um estilo de um elemento para outro.

Suponha que você decida definir o texto do parágrafo acima (em vez do elemento h1) como cinza. Basta mudar o seletor h1 para p:

html {color:black;}
p {color:gray;}
h2 {color:silver;}

Experimente você mesmo

Seletor de tipo

No padrão W3C, o seletor de elemento também é chamado de seletor de tipo (type selector).

“O seletor de tipo escolhe o nome do tipo do elemento do documento. O seletor de tipo escolhe cada instância do tipo de elemento no documento.”

As seguintes regras correspondem a todos os elementos h1 no documento:

h1 {font-family: sans-serif;}

Portanto, também podemos definir estilos para os elementos de documentos XML:

Documento XML:

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/css" href="note.css"?>
<note>
<to>George</to>
<from>John</from>
<heading>Reminder</heading>
<body>Don't forget the meeting!</body>
</note>

Documento CSS:

note
  {
  font-family:Verdana, Arial;
  margin-left:30px;
  }
to
  {
  font-size:28px;
  display: block;
  }
from
  {
  font-size:28px;
  display: block;
  }
heading
  {
  color: red;
  font-size:60px;
  display: block;
  }
body
  {
  color: blue;
  font-size:35px;
  display: block;
  }

Ver Efeito

Através dos exemplos acima, você pode ver que o seletor de elemento do CSS (seletor de tipo) pode definir estilos para elementos de documentos XML.

Se você precisar de mais informações sobre adicionar estilos a documentos XML, acesse o CodeW3C Tutorial XML.