CSS3

Pseudo classi strutturali

Le pseudo classi permettono di differenziare un oggetto sulla base del suo stato, come :hover, :visited e :active, vale a dire su informazioni che non fanno parte della struttura ad albero del documento.

Structural pseudo-classes

E:first-child {... style...}

Selector summay

Selectors can be separed into two categories. The first are those that act directly on elements defined in the document tree, the second category contains pseudo-selectors, that act on elments/information outside of the document tree.

Attribute selectors W3 Docs

E[attr] {... style...}
```
<E attr='a value'>...</E>
```
E[attr='moo'] {... style...}
```
<E attr='moo'>...</E>
```
E[attr~='moo'] {... style...}
```
<E attr='loo mooboo'>...</E>
```
E[attr|='moo'] {... style...} - This one is tipically used with lang attribute. For example E[lang|=es] matches both lang='es-ES' and lang='es-MX' E elements.
```
<E attr='moo'>...</E>
<E attr='moo-boo'>...</E>
```

Selettori

I selettori CSS possono essere divisi in due categorie. Quelli della prima si applicano direttamente agli elementi che compongono la struttura del documento HTML. Quelli nella seconda si chiamano "pseudo-selectors", e possono agire su elementi e informazioni che non fanno parte della struttura del documento.

Attribute selectors W3 Docs

E[attr] {... style...}
```
<E attr='a value'>...</E>
```
E[attr='moo'] {... style...}
```
<E attr='moo'>...</E>
```
E[attr~='moo'] {... style...}
```
<E attr='loo mooboo'>...</E>
```
E[attr|='moo'] {... style...} - Questo esempio è usato spesso con il tag 'lang'. Per esempio E[lang|=es] si applica sia a lang='es-ES' sia a lang='es-MX'.
```
<E attr='moo'>...</E>
<E attr='moo-boo'>...</E>
```

Structural pseudo-classes in CSS

Pseudo-classes differentiates among an element's different state or type, such as link states :hover, :visited and :active. Pseudo-classes provide a way to select an element based on information that is not specified in che document tree.

Structural pseudo-classes

E:first-child {... style...}