# Module CSS3 : Sélecteurs W3C

## Document de Travail du W3C 26 Janvier 2001

Cette version:
  http://www.w3.org/TR/2001/WD-css3-selectors-20010126
Dernière version:
  http://www.w3.org/TR/css3-selectors
Versions précédentes:
  http://www.w3.org/TR/2000/WD-css3-selectors-20001005
  http://www.w3.org/TR/2000/WD-css3-selectors-20000410
Éditeurs:
  Daniel Glazman (Netscape/AOL)
  Tantek Çelik (Microsoft Corporation)
  Ian Hickson

  Peter Linss (ancien éditeur, anciennement de Netscape/AOL)
  John Williams (ancien éditeur, Quark, Inc.)

Copyright ©2001 W3C (MIT, INRIA, Keio), tous droits réservés. Les règles du W3C sur la responsabilité, les marques de commerce, les droits d'auteur et les licences de logiciels sont applicables.

## Résumé

Les CSS (Cascading Style Sheets) sont un langage permettant de décrire la restitution de documents HTML et XML à l'écran, sur papier, vocalement, etc. Pour attacher des propriétés stylistiques aux éléments du document, elles utilisent les sélecteurs, qui sont des conditions de sélection de ces éléments. Ce document de travail décrit les sélecteurs proposés pour CSS level 3. Il comprend et étend les sélecteurs de CSS level 2.

## Statut de ce document

Ce document est une version de travail de l'un des "modules" de la future spécification CSS3. Il ne décrit pas seulement les sélecteurs déjà présents en CSS1 et CSS2, mais propose également de nouveaux sélecteurs pour CSS3 ainsi que pour les autres langages qui pourraient en avoir besoin. Le Groupe de Travail ne s'attend pas à ce que toutes les implémentations des CSS3 implémentent tous les types de sélecteurs. A la place, il y aura probablement un petit nombre de variantes des CSS3, aussi appelées "profils". Par exemple, il est possible que seul le profil pour les Agents Utilisateurs non interactifs contienne l'ensemble des sélecteurs proposés ici.

Ce document est un document de travail du Groupe de Travail CSS & FP faisant partie de l'activité Style.

Le Groupe de Travail pense que cette spécification est prête et souhaite donc en faire le dernier appel à commentaires. Si le retour est positif, la spécification deviendra une Recommendation Candidate du W3C. Les commentaires doivent être reçus avant le 1er Mars 2001.

Les commentaires sur ce document de travail et les discussions le concernant peuvent être envoyés dans la liste de diffusion publique (archivée) www-style@w3.org (voyez les instructions). Les Membres du W3C peuvent également envoyer leurs commentaires directement au Groupe de Travail CSS & FP.

Ce document est toujours à l'état de document de travail et peut donc être mis à jour, remplacé ou rendu obsolète par d'autres documents du W3C à tout moment. Il est inapproprié d'utiliser les Documents de Travail du W3C en tant que documents de référence ou de les citer autrement qu'en tant que "travaux en cours". Sa publication n'implique pas son acceptation officielle par les membres du W3C ou par le Groupe de Travail CSS & FP (Accès réservé au membres du W3C).

La dernière version de ce document de travail est disponible en suivant le lien "Dernière version" ci-dessus, ou en visitant la liste des Rapports Techniques du W3C.

Des traductions de ce document sont disponibles. La version anglaise de cette spécification est la seule version normative.

## Dépendances aux autres Modules CSS3

- Syntaxe Générale (Module 1)
- Assignation de Valeur, Cascade et Héritage (Module 4)
- Contenu Généré / Marqueurs (Module 14)
- Interface Utilisateur (Module 17)

## Table des matières

## 1. Contexte

Les membres du CSS & FP Working Group ont décidé durant leur réunion de Clamart de la modularisation de la spécification CSS.

Cette modularisation des CSS, associée à l'externalisation de la syntaxe générale, va diminuer la taille de la spécification et va permettre à de nouveaux langages de réutiliser les sélecteurs et/ou la syntaxe générale des CSS. Par exemple pour la définition de comportements ou de transformations d'arbre.

Cette spécification contient sa propre suite de tests, un test par concept introduit dans ce document. Ces tests ne sont pas des tests de conformité absolue mais se proposent de fournir aux usagers un moyen simple de vérifier si une partie de cette spécification est implémentée au moins a minima ou, au contraire, pas du tout.

### 1.1. Changements par rapport à CSS 2

Les principales différences entre les Sélecteur CSS 2 et les Sélecteurs W3C sont :

- la liste des définitions de base (sélecteur, groupe de sélecteurs, sélecteur simple, etc.) a été clarifiée,
- un composant optionel d'espace de noms est désormais autorisé dans les sélecteurs de type, le sélecteur universel et les sélecteurs d'attribut,
- un nouveau combinateur,
- de nouveaux sélecteurs simples comme les sélecteurs de sous-chaîne dans une valeur d'attribut ou de nouvelles pseudo-classes,
- de nouveaux pseudo-éléments,
- une ré-écriture de la grammaire des sélecteurs,
- des profils à ajouter aux spécifications intégrant les Sélecteurs W3C et définissant le jeu de sélecteurs reconnu et accepté par ces spécifications,
- les Sélecteurs W3C sont désormais un Module CSS 3 et une spécification indépendante. D'autres spécifications peuvent se référer à ce document indépendamment des CSS,
- la spécification contient désormais sa propre suite de tests.

## 2. Sélecteurs

Un sélecteur W3C représente une structure. Cete structure peut être vue par exemple comme une condition (p.ex. dans une règle CSS) qui détermine quels éléments de l'arbre documentaire sont sélectionnés par le sélecteur, ou comme une description plate du fragment HTML ou XML correspondant à cette structure.

Les sélecteurs W3C vont de la simple représentation du nom d'un élément jusqu'à des représentations contextuelles complexes.

La table qui suit résume la syntaxe des sélecteurs W3C :

Séquence | Signification | Décrit en section | Défini originellement en CSS niveau
--- | --- | --- | ---
* | tout élément | Sélecteur universel | 2
E | tout élément de type E | Sélecteur de type d'élément | 1
E[foo] | tout élément E portant l'attribut "foo" | Sélecteurs d'attribut | 2
E[foo="bar"] | tout élément E portant l'attribut" foo" et dont la valeur de cet attribut est exactement "bar" | Sélecteurs d'attribut | 2
E[foo~="bar"] | tout élément E dont l'attribut "foo" contient une liste de valeurs séparées par des espaces, l'une de ces valeurs étant exactement égale à "bar" | Sélecteurs d'attribut | 2
E[foo^="bar"] | tout élément E dont la valeur de l'attribut "foo" commence exactement par la chaîne "bar" | Sélecteurs d'attribut | 3
E[foo$="bar"] | tout élément E dont la valeur de l'attribut "foo" finit exactement par la chaîne "bar" | Sélecteurs d'attribut | 3
E[foo*="bar"] | tout élément E dont la valeur de l'attribut "foo" contient la sous-chaîne "bar" | Sélecteurs d'attribut | 3
E[lang|="en"] | tout élément E dont l'attribut 'lang" est une liste de valeurs séparées par des tirets et commençant (à gauche) par "en" | Sélecteurs d'attribut | 2
E:root | un élément E, racine du document | Pseudo-classes structurelles | 3
E:nth-child(n) | un élément E qui est le n-ième enfant de son parent | Pseudo-classes structurelles | 3
E:nth-last-child(n) | un élément E qui est le n-ième enfant de son parent en comptant depuis le dernier enfant | Pseudo-classes structurelles | 3
E:nth-of-type(n) | un élément E qui est le n-ième enfant de son parent et de ce type | Pseudo-classes structurelles | 3
E:nth-last-of-type(n) | un élément E qui est le n-ième enfant de son parent et de ce type en comptant depuis le dernier enfant | Pseudo-classes structurelles | 3
E:first-child | un élément E, premier enfant de son parent | Pseudo-classes structurelles | 2
E:last-child | un élément E, dernier enfant de son parent | Pseudo-classes structurelles | 3
E:first-of-type | un élément E, premier enfant de son type | Pseudo-classes structurelles | 3
E:last-of-type | un élément E, dernier enfant de son type | Pseudo-classes structurelles | 3
E:only-child | un élément E, seul enfant de son parent | Pseudo-classes structurelles | 3
E:only-of-type | un élément E, seul enfant de son type | Pseudo-classes structurelles | 3
E:empty | un élément E qui n'a aucun enfant (y compris noeuds textuels purs) | Pseudo-classes structurelles | 3
E:link E:visited | un élément E qui est la source d'un hyperlien dont la cible n'a pas encore été visitée (:link) ou a déjà été visitée (:visited) | Les pseudo-classes de lien | 1
E:active E:hover E:focus | un élément E pendant certaines actions de l'usager | Les pseudo-classes d'action Usager | 1 and 2
E:target | un élément E qui est la cible de l'URL d'origine contenant lui-même un fragment identifiant. | La pseudo-classe :target | 3
E:lang(c) | un élément E dont le langage (humain) est c (le langage du document spécifie comment le langage humain est déterminé) | La pseudo-classe :lang() | 2
E:enabled E:disabled | un élément d'interface utilisateur E qui est actif ou inactif. | Les pseudo-classes d'état d'élément d'interface | 3
E:checked E:indeterminate | un élément d'interface utilisateur E qui est coché ou dont l'état est indéterminé (par exemple un bouton-radio ou une case à cocher) | Les pseudo-classes d'état d'élément d'interface | 3
E:contains("foo") | un élément E dont le contenu textuel concaténé contient la sous-chaîne "foo" | La pseudo-classe de contenu | 3
E::first-line | la première ligne formatée d'un élément E | The :first-line pseudo-element | 1
E::first-letter | le premier caractère formaté d'un élément E | Le pseudo-élément ::first-letter | 1
E::selection | la partie d'un élément E qui est actuellement sélectionnée/mise en exergue par l'usager | Les pseudo-éléments fragments d'éléments d'interface | 3
E::before | le contenu généré avant un élément E | Le pseudo-élément ::before | 2
E::after | le contenu généré après un élément E | Le pseudo-élément ::after | 2
E.warning | Uniquement en HTML. Identique à E[class~="warning"]. | Sélecteurs de classe | 1
E#myid | un élément E dont l'ID est égal à "myid". | Sélecteurs d'ID | 1
E:not(s) | un élément E qui n'est pas représenté par le sélecteur simple s | La pseudo-classe de négation | 3
E F | un élément F qui est le descendant d'un élément E | Combinateur de descendance | 1
E > F | un élément F qui est le fils d'un élément E | Combinateur filial | 2
E + F | un élément F immédiatement précédé par un élément E | Combinateur d'adjacence directe | 2
E ~ F | un élément F précédé par un élément E | Combinateur d'adjacence indirecte | 3

Exemple : en CSS, la signification réelle de chaque sélecteur est déterminée à partir de la table ci-dessus en faisant précéder le mot "sélectionne" au contenu de chaque cellule de la colonne "Signification".

## 3. Sensibilité à la casse

La sensibilité à la casse des noms d'éléments d'un langage de documents donné dans les sélecteurs W3C dépend du langage de documents en question. Par exemple, en HTML, les noms d'éléments ne sont pas senbibles à la casse, alors qu'ils le sont en XML

La sensibilité à la casse des noms d'attribus et des valeurs d'attributs dépend également du langage de documents.

## 4. Syntaxe des sélecteurs

Un sélecteur est une chaîne d'une ou plusieurs séquences de sélecteurs simples séparés par des combinateurs.

Une séquence de sélecteurs simples est une chaîne de sélecteurs simples qui ne sont pas séparés par des combinateurs. Ele commence toujours par un sélecteur de type d'élément ou un sélecteur universel. Aucun autre sélecteur de type d'élément ou sélecteur universel n'est autorisé dans la séquence.

Un sélecteur simple est soit un sélecteur de type d'élément, un sélecteur universel, un sélecteur d'attribut, un sélecteur d'ID, un sélecteur de contenu ou une pseudo-classe. Un pseudo-élément peut suivre la dernière séquence de sélecteurs simples.

Les combinateurs sont : l'espace, "`>`", "`+`" et "`~`". Un espace peut être présent entre un combinateur et les sélecteurs simples qui l'entourent. Seuls les caractères "espace" (code Unicode 32), "tab" (9), "saut de ligne" (10), "retour chariot" (13), and "saut de page" (12) peuvent composer un espace. Les autres caractères de type espace, comme "em-space" (8195) et "ideographic space" (12288), ne peuvent composer un espace.

## 5. Groupes de sélecteurs

Quand plusieurs sélecteurs sont associés aux mêmes déclarations, ils peuvent être groupés en les séparant par des virgules.

Exemples CSS :

Dans cette exemple, les trois règles CSS sont réduites à une seule :

    h1 { font-family: sans-serif }
    h2 { font-family: sans-serif }
    h3 { font-family: sans-serif }

est équivalent à :

    h1, h2, h3 { font-family: sans-serif }

Attention : cette équivalence est vérifiée dans cet exemple car les trois sélecteurs initiaux sont des sélecteurs valides. Si l'un ou plus de ces sélecteurs est invalide, le groupe composé des trois sélecteurs est lui-même invalide, invalidant l'ensemble de la règle ; il n'y a alors pas équivalence.

## 6. Sélecteurs simples

### 6.1 Sélecteur de type d'élément

Un sélecteur de type d'élément est le nom d'un type d'élement du langage de documents. Un sélecteur de type d'élement représente une occurence d'un élément du type donné dans l'arbre du document.

Exemple(s):

Le sélecteur suivant représente un élément `h1` dans l'arbre du document :

    h1

#### 6.1.1 Sélecteur de type d'élément et Espaces de noms

Les sélecteurs de type d'élément peuvent contenir un composant optionel d'espace de noms. Un préfixe d'espace de noms préalablement déclaré (via une règle-at `@namespace`) peut être préfixé à un nom d'élément en les séparant par le séparateur d'espace de noms "`|`". Le composant d'espace de noms peut être laissé vide pour indiquer que le sélecteur ne représente que des éléments sans espace de noms déclaré. De plus, une étoile peut être utilisée comme préfixe d'espace de noms, indiquant alors que le sélecteur représente des élements dans quelque espace de noms que ce soit (y compris les éléments sans espace de noms déclaré). Les sélecteurs de type d'élément qui n'ont pas de composant d'espace de noms (pas de séparateur d'espace de noms) représentent les éléments sans considération d'espace de noms (équivalent à "`*|`") sauf si un espace de noms par défaut à été déclaré, auquel cas le sélecteur représente les éléments dans cet espace de noms par défaut.

Une autre approche serait d'associer les sélecteurs de type d'élément n'ayant pas de composant d'espace de noms qu'aux éléments n'ayant pas d'espace de noms (sauf si un espace de noms par défaut a été déclaré). Dans ce cas, le sélecteur "`h1`"serait équivalent au sélecteur "`|h1`" et non pas au sélecteur "`*|h1`". L'aspect négatif de cette approche est que les feuilles de styles existantes (écrites dans usage d'espaces de noms) serait inopérantes dans tous les documents faisant usage des espaces de noms, c'est-à-dire dans tous les documents XHTML.

Il doit être noté que si un préfixe d'espace de noms utilisé dans un sélecteur n'a pas été préalablement déclaré, le sélecteur doit alors être considéré comme invalide et l'ensemble de la règle est alors ignorée en conformité avec les règles standard de gestion d'erreur.

Il doit être de plus noté que dans un outil gérant les espaces de noms, les sélecteurs de type d'élément sont comparés seulement à la partie locale du nom qualifié d'un élément. Voir ci-dessous pour les comparaisons effectuées dans un outils ne gérant pas les espaces de noms.

En résumé :

`ns|E`
  éléments E dans l'espace de nom ns
`*|E`
  éléments E dans tout espace de noms, y compris ceux sans espace de noms déclaré
`|E`
  éléments E sans espace de noms déclaré
`E`
  si aucun espace de noms par défaut n'a été déclaré, ceci est équivalent à *|E. Sinon, c'est équivalent à ns|E où ns est l'espace de noms par défaut.

Exemples CSS :

    @namespace foo url(http://www.foo.com);

    foo|h1 { color: blue }

    foo|* { color: yellow }

    |h1 { color: red }

    *|h1 { color: green }

    h1 { color: green }

La première règle sélectionnera uniquement les éléments `h1` dans l'espace de noms "http://www.foo.com".

La seconde règle sélectionnera tous les éléments de l'espace de noms "http://www.foo.com".

La troisième règle sélectionnera uniquement les éléments `h1` elements sans déclaration d'espace de noms.

La quatrième règle sélectionnera les éléments `h1` dans tout espace de noms (y compris ceux sans espace de noms déclaré).

La dernière règle est équivalente à la quatrième car aucun espace de noms par défaut n'a été défini.

### 6.2 Sélecteur universel

Le sélecteur universel, dénoté"`*`", represente le nom qualifié de tout type d'élément. Il représente donc tout élément de l'arbre du document dans tout espace de noms (y compris les éléments sans espace de noms déclaré) si aucune espace de noms par défaut n'a été déclaré. Si un espace de noms par défaut a été déclaré, consultez ci-dessous Sélecteur universel et Espaces de noms.

Si le sélecteur universel n'est pas le seul composant d'une séquence de sélecteurs simples, le `*` peut être omis. Par exemple:

- `*[LANG=fr]` et `[LANG=fr]` sont équivalents,
- `*.warning` et `.warning` sont équivalents,
- `*#myid` et `#myid` sont équivalents.

Attention : il est recommandé de ne pas omettre le `*`, representant le sélecteur universel.

#### 6.2.1 Sélecteur universel et Espace de noms

Le sélecteur universel peut contenir un composant optionel d'espace de noms

`ns|*`
  tous les éléments de l'espace de noms ns
`*|*`
  tous les éléments
`|*`
  tous les éléments sans espace de noms déclaré
`*`
  si aucun espace de noms par défaut n'a été spécifié, ceci est équivalent à *|*. Dans le cas contraire, c'est équivalent à ns|* où ns est l'espace de noms par défaut.

### 6.3 Sélecteurs d'attribut

Les sélecteurs W3C permettent de représenter les attributs attachés à un élément.

#### 6.3.1 Représentation des attributs et des valeurs d'attributs

Quatre différents sélecteurs d'attribut sont disponibles :

`[att]`
  Représente l'attribut`att`, quelque soit la valeur de l'attribut.
`[att=val]`
  Représente l'attribut `att`, sa valeur étant exactement égale à "val".
`[att~=val]`
  Représente l'attribut `att`, sa valeur étant une liste de mots séparés par des espaces, l'un de ces mots étant exactement "val". En cas d'usage de ce sélecteur, les mots dans la valeur ne doivent pas être séparés par des espaces (puisqu'ils sont séparés par des espaces).
`[att|=val]`
  Représente l'attribut `att`, sa valeur étant une liste de mots séparés par des tirets et commençant par "val". La comparaison se fait toujours au début de la valeur de l'attribut. Ceci est principalement destiné à la sélection de sous-codes linguistiques (p.ex. l'attribut `LANG` en HTML) conformément à la RFC 1766 ([RFC1766]).

Les valeurs d'attributs doivent être des identificateurs ou des chaînes de caractères. La sensibilité à la casse des noms d'attributs et de leurs valeurs dépend du langage de documents.

Exemple(s):

Par exemple, le sélecteur suivant représente un élément `h1` portant l'attribut `title`, quelque soit sa valeur:

    h1[title]

Exemple(s):

Dans l'exemple suivant, le sélecteur représente un élément `span` dont l'attribut `class` a exactement la veleur "exemple":

    span[class=exemple]

Plusieurs sélecteurs d'attribut peuvent être utilisés pour représenter plusieurs attributs d'un élément, ou plusieurs fois le même attribut.

Exemple(s):

Ici, le sélecteur représente un élément `span` dont l'attribut `hello` a exactement la valeur "Cleveland" et dont l'attribut `goodbye` a exactement la valeur "Columbus":

    span[hello="Cleveland"][goodbye="Columbus"]

Exemple(s):

Les sélecteurs suivants illustrent les différences entre "=" et "~=". Le premier sélecteur représentera, par exemple, la valeur "copyright copyleft copyeditor" pour l'attribut `rel`. Le second sélecteur représentera uniquement un élément `a` dont l'attribut `href` a exactement la veleur "http://www.w3.org/".

    a[rel~="copyright"]
    a[href="http://www.w3.org/"]

Exemple(s):

Le sélecteur suivant représente un élément quelconque dont l'attribut `lang` a la valeur "fr" (p.ex. dont la langue est le Français).

    *[lang=fr]

Exemple(s):

Le sélecteur qui suit représente un élément quelconque dont l'attribut `lang` a une valeur commençant par "en", par exemple "en", "en-US" ou "en-cockney":

    *[lang|="en"]

Exemple(s):

De même, les sélecteurs qui suivent représentent un élément `DIALOGUE` ayant deux valeurs différentes pour le même attribut `character`:

    DIALOGUE[character=romeo]

    DIALOGUE[character=juliet]

#### 6.3.2 Sélecteurs de sous-chaîne dans la valeur d'un attribut

Trois différents sélecteurs d'attribut sont disponibles pour la représentation d'une séquence dans la valeur d'un attribut :

`[att^="val"]`
  Représente l'attribut `att`, sa valeur commençant exactement par le préfixe "val"
`[att$=ident]`
  Représente l'attribut `att`, sa valeur finissant exactement par le préfixe "ident"
`[att*="val"]`
  Représente l'attribut `att`, sa valeur contenant au moins une fois la sous-chaîne "val"

Les valeurs d'attributs doivent être des identificateurs ou des chaîne de caractères. La sensibilité à la casse des noms d'attributs et de leurs valeurs dépend du langage de documents.

Exemple(s) :

Le sélecteur suivant représente un élément HTML `object`, ciblant une image.

    object[type^="image/"]

Le sélecteur suivant représente un élément XML `foo1` portant l'attribut `bar`, la valeur de cet attribut finissant par "cpg".

    foo1[bar$="cpg"]

Le sélecteur suivant représente un paragraphe HTML dont la valeur de l'attribut `title` contient la sous-chaîne "hello".

    p[title*="hello"]

#### 6.3.3 Sélecteurs d'attribut et Espace de noms

Les sélecteurs d'attribut peuvent contenir un composant optionel d'espace de noms. Un préfixe correspondant à un espace de noms préalablement déclaré (via la règle-at `@namespace`) peut précéder le nom d'un attribut en les séparant par le séparateur d'espace de noms "`|`". En conformité avec la recommandation Namespaces in XML, les espaces de noms par défaut ne s'appliquent pas aux attributs, et les sélecteurs d'attributs sans composant d'espace de noms représentent donc seulement les attributs sans espace de noms déclaré (équivalent à "`|attr`"). Une étoile peut être utilisée comme composant d'espace de noms pour indiquer que le sélecteur représente tous les attributs sans considération d'espaces de noms.

Exemples CSS :

    @namespace foo "http://www.foo.com";

    [foo|att=val] { color: blue }

    [*|att] { color: yellow }

    [|att] { color: green }

    [att] { color: green }

La première règle s'appliquera uniquement aux éléments portant l'attribut `att` dans l'espace de noms "http://www.foo.com" avec la valeur "val".

La second règle s'appliquera uniquement aux éléments portant l'attribut `att` sans considération d'espace de noms (incluant ceux sans espace de noms déclaré).

Les deux dernières règles sont équivalentes et s'appliqueront uniquement aux éléments portant l'attribut `att` sans déclaration d'espace de noms.

#### 6.3.4 Valeurs d'attribut par défaut dans les DTDs

Les sélecteurs d'attribut représentent des valeurs d'attribut dans l'arbre documentaire. Des valeurs d'attribut par défaut peuvent être définies dans la DTD ou ailleurs. Les Sélecteurs W3C doivent être implémentés de manière à fonctionner même si les valeurs par défaut ne sont pas présentes dans l'arbre documentaire.

Exemple(s):

Par exemple, considérons un élément `EXAMPLE` avec un attribut `notation` ayant la valeur par défaut "decimal". Le fragment de DTD pourrait être:

    <!ATTLIST EXAMPLE notation (decimal,octal) "decimal">

Si les sélecteurs suivants représentent un élément `EXAMPLE` dont la valeur de l'attribut `notation` est explicitement définie

    EXAMPLE[notation=decimal]
    EXAMPLE[notation=octal]

on pourra utiliser le sélecteur qui suit pour représenter le cas où l'attribut est défini par défaut, et non explicitement:

    EXAMPLE

### 6.4 Sélecteurs de classe

En HTML, les auteurs peuvent utiliser la notation point (`.`) comme alternative à la notation `~=` notation dans le cas de l'attribut `class`. En HTML, `div.value` et `div[class~=value]` ont donc la même signification. La valeur de l'attribut doit suivre immédiatement le "`.`".

Exemple(s):

On pourra représenter un élément quelconque portant `class~="pastoral"` de la manière suivante:

    *.pastoral

ou tout simplement

    .pastoral

Le sélecteur suivant représente un élément `h1` portant `class~="pastoral"`:

    h1.pastoral

Exemple(s):

Le sélecteur suivant représente un élément `p` dont l'attribut `class` contient une liste de valeurs séparées par des espaces et contenant "pastoral" et "marine":

    p.pastoral.marine

Il est absolument identique à :

    p.marine.pastoral

Ce sélecteur représente par exemple un élément `p` avec `class="pastoral blue aqua marine"` ou `class="marine blue pastoral aqua"` mais pas avec `class="pastoral blue"`.

### 6.5 Sélecteurs d'ID

Les langages de documents peuvent contenir des attributs qui sont déclarés être de type ID. Les attributs de type ID sont spéciaux en ce sens que deux tels attributs ne peuvent pas avoir la même valeur dans un document, sans considération du type des éléments qui les portent ; quelque soit le langage, un attribut `ID` peut être utilisé pour identifier de façon unique les éléments. En HTML, tous les attributs ID sont nommés "id" ; les applications XML peuvent nommer les attributs ID différemment, mais avec les mêmes contraintes.

L'attribut ID d'un langage de documents permet aux auteurs d'assigner un identificateur à une instance d'élément dans l'arbre documentaire. Les sélecteurs W3C d'ID représentent une instance d'élément en se basant sur son identificateur. Un sélecteur d'ID contient un "`#`" immédiatement suivi de la valeur d'ID.

Exemple(s):

Le sélecteur d'ID qui suit représente un élément `h1` dont l'attribut `id` a la valeur "chapter1" :

    h1#chapter1

Le sélecteur d'ID ci-dessous représente tout élément dont l'attribut `id` a la valeur "chapter1" :

    #chapter1

Le sélecteur d'ID suivant représente tout élément dont l'ID a la valeur "z98y".

    *#z98y

Note. En XML 1.0 [XML10], l'information déterminant quels attributs contiennent les IDs d'éléments est contenue dans une DTD. Lors du parsing XML, les Agents Utilisateurs ne lisent pas toujours la DTD, and peuvent donc ne pas savoir ce qu'st l'ID d'un élément. Si un auteur de feuille de styles sait ou soupçonne que tel est le cas, il doit alors plutôt utiliser les sélecteurs d'attributs usuels : `[name=p371]` au lieu de `#p371`. Bien entendu, les éléments de documents XML 1.0 sans DTD n'ont pas d'ID du tout.

### 6.6 Pseudo-classes

Le concept de pseudo-classe est introduit pour permettre une sélection basée sur des informations qui résident à l'extérieur de l'arbre documentaire ou qui ne peuvent pas être exprimées à l'aide des autres sélecteurs simples.

Une pseudo-classe contient toujours deux-points (`:`) suivis du nom de la pseudo-classe et optionnellement d'une valeur entre parenthèses.

Les pseudo-classes sont autorisées dans toutes les séquences de sélecteurs simples contenues dans un sélecteur. Les pseudo-classes sont autorisées partout dans une séquence de sélecteurs simples, après le sélecteur de type ou le sélecteur universel (éventuellement omis) initial. Les noms des pseudo-classes sont insensibles à la casse. Quelques pseudo-classes sont mutuellement exclusives, alors que d'autres peuvent être appliquées simultanément au même élément. Des pseudo-classes peuvent être dynamiques, en ce sens qu'un élément peut acquérir ou perdre une pseudo-classe lorsqu'un usager interagit avec le document.

#### 6.6.1 Pseudo-classes dynamiques

Les pseudo-classes dynamiques classent les éléments selon des caractéristiques autres que le nom, les attributs ou le contenu, caractéristiques qui en principe ne peuvent pas être déduites de l'arbre documentaire.

Les pseudo-classes dynamiques n'apparaissent pas dans le source du document ni dans l'arbre documentaire.

##### Les pseudo-classes de liens : :link et :visited

Les Agents Utilisateurs restituent les liens non visités différemment des liens visités. Les Sélecteurs W3C offrent les pseudo-classes `:link` et `:visited` pour les distinguer :

- La pseudo-classe `:link` caractérise les liens qui n'ont pas encore été visité,.
- La pseudo-classe `:visited` s'applique une fois que le lien a été visité par l'usager.

Note. Après un certain délai, les Agents Utilisateurs peuvent choisir de ramener un lien à l'état (non visité) ':link'.

Les deux états sont mutuellement exclusives.

Exemple(s):

Le sélecteur suivant représente des liens portant la classe `external` et déjà visités :

    a.external:visited

##### Les pseudo-classes d'action usager :hover, :active, and :focus

Les Agents Utilisateurs interactifs changent parfois la restitution en réponse à des actions de l'usager. Les Sélecteurs W3C offrent trois pseudo-classes pour la sélection d'un élément sur lequel l'usager agit.

- La pseudo-classe`:hover` s'applique quand l'utilisateur désigne un élément (avec un périphérique de pointage), mais ne l'active pas. Par exemple, un Agent Utilisateur visuel pourrait appliquer cette pseudo-classe quand le curseur (le pointeur de la souris) se trouve au-dessus d'une boîte générée par l'élément. Les Agents Utilisateurs ne supportant pas les media interactifs n'ont pas à supporter cette pseudo-classe. Certains Agents Utilisateurs conformes et supportant les media interactifs peuvent ne pas être capable de supporter cette pseudo-classe (par exemple, un stylet de pointage).
- La pseudo-classe `:active` s'applique pendant qu'un élément est activé par l'utilisateur. Par exemple, entre le moment où l'utilisateur appuie sur le bouton de la souris et celui où il le relache.
- La pseudo-classe `:focus` s'applique pendant qu'un élément a le focus (accepte les évènements clavier ou souris, ou d'autres formes d'entrée).

Seuls les éléments dont la propriété 'user-input' (Cf. [UI]) a pour valeur "enabled" peuvent devenir `:active` ou acquérir `:focus`.

Ces pseudo-classes ne sont pas mutuellement exclusives. Un élément peut déclencher plusieurs d'entre elles en même temps.

Exemple(s):

    a:link    /* liens non visites */
    a:visited /* liens visites     */
    a:hover   /* survol            */
    a:active  /* liens actifs      */

Exemple(s):

Un exemple de pseudo-classes dynamiques combinées :

    a:focus
    a:focus:hover

Le dernier sélecteur représente les éléments `A` qui ont la pseudo-classe :focus et la pseudo-classe :hover.

Note. Un élément peut être à la fois ':visited' et ':active' (ou ':link' et ':active').

#### 6.6.2 La pseudo-classe :target

Certains URIs se réfèrent à un point bien déterminé dans une ressource. Ce type d'URI se termine par "`#`" suivi par un identificateur d'ancre (appelé l'identificateur de fragment).

Les URIs avec un identificateur de fragment ciblent un élément donné dans le document, appelé élément cible. Par exemple, voici un URI ciblant une ancre nommée section_2 dans un document HTML :

    http://somesite.com/html/top.html#section_2

Un élément cible peut être représenté par la pseudo-classe`:target` :

    p.bar:target

représente un élément `p` de classe bar qui est la cible deURI.

Exemple CSS d'usage de la pseudo-classe `:target` :

    *:target { color : red }

    *:target:before { content : url(target.png) }

#### 6.6.3 La pseudo-classe :lang

Si le langage de documents spécifie comment est déterminée la langue humaine d'un élément, il est possible d'écrire des sélecteurs qui représentent un élément sur la base de sa langue. Par exemple, en HTML [HTML40], la langue est déterminée par la combinaison de l'attribut `lang`, de l'élément `meta`, et potentiellement d'informations venant du protocole (comme les en-têtes HTTP). XML utilise un attribut appelé `XML:LANG`, et il peut y avoir d'autres méthodes spécifiques au langage de documents pour déterminer la langue.

La pseudo-classe `:lang(C)` représente un élément dans la langue C. C est ici un code linguistique comme spécifié par HTML 4.0 [HTML40] et RFC 1766 [RFC1766]. Il est sélectionné de la même manière que par le sélecteur d'attribut linguistique `[att |= "C"]`.

Exemple(s):

Les deux premiers sélecteurs ci-dessous représentent un document HTML qui est en Français ou en Allemand. Les deux sélecteurs suivants représentent des citations `q` contenues dans un élément quelconque dont la langue est le Français ou l'Allemand.

    html:lang(fr)
    html:lang(de)
    :lang(fr) > q
    :lang(de) > q

#### 6.6.4 Les pseudo-classes d'état d'élément d'inteface

##### Les pseudo-classes :enabled et :disabled

La pseudo-classe `:enabled` permet aux auteurs de modifier le style des éléments d'interface qui sont actifs - que l'utilisateur peut sélectionner/activer d'une manière ou d'une autre (par exemple en cliquant sur un bouton avec la souris). Une telle pseudo-classe est utile parce qu'il est autrement impossible de spécifier programmatiquement l'apparence par défaut de disons un élément `input` actif sans spécifier également son allure s'il est inactif.

Parallèlement à `:enabled`, `:disabled` permet aux auteurs de spécifier exactement comment un élément d'interface inactif ou inactivé doit être restitué.

Notez que la plupart des éléments ne sont ni actifs ni inactifs. Un élément est actif si l'utilisateur peut l'activer ou lui transférer le focus. Un élément est inactif s'il peut être actif, mais que l'utilisateur ne peut à ce moment précis l'activer ou lui transférer le focus.

##### La pseudo-classe :checked

La pseudo-classe `:checked` ne s'applique aux éléments qui ont 'user-input: enabled' ou 'user-input : disabled' (voyez [UI] à propos de la propriété 'user-input'). L'utilisateur peut changer l'état des éléments radio et cases à cocher. Quelques entrées de menu sont "cochées" quand l'utilisateur les sélectionne. Quand de tels éléments passent dans l'état "allumé", la pseudo-classe `:checked` s'applique. La pseudo-classe `:checked` s'applique initialement à de tels éléments qui possèdent l'attribut HTML4 `selected` tels que décrits dans la Section 17.2.1 de HTML4, mais bien entendu l'utilisateur peut faire passer à "éteint" ces éléments auquel car la pseudo-classe `:checked` ne s'applique plus. Alors que la pseudo-classe `:checked` est dynamique par nature, et est modifiée par l'action de l'utilisateur, elle s'applique à tous les media puisqu'elle peut aussi se fonder sur la présence de l'attribut sémantique HTML4 `selected`.

##### La pseudo-classe :indeterminate

La pseudo-classe `:indeterminate` s'applique aux éléments qui ont 'user-input: enabled' ou 'user-input: disabled' (voyez [UI] à propos de la propriété 'user-input'). Les éléments radio et cases à cocher peuvent être changés d'état par l'utilisateur, mais sont parfois dans un état indéterminé, ni coché ni non-coché. Cela peut être causé par un attribut de l'élément, ou par une manipulation du DOM. La pseudo-classe `:indeterminate` s'applique à de tels éléments. Alors que la pseudo-classe `:indeterminate` est dynamique par nature, et est modifiée par l'action de l'utilisateur, elle s'applique à tous les media puisqu'elle peut aussi se fonder sur la présence de l'attribut sémantique HTML4 `selected`.

Les composants d'un radio-groupe sans choix pré-sélectionné sont un exemple d'état `:indeterminate`.

#### 6.6.5 Les pseudo-classes structurelles

Les Sélécteurs W3C introduisent la notion de pseudo-classes structurelles qui permettent la sélection sur la base d'informations supplémentaires se trouvant dans l'arbre documentaire mais qui ne peuvent être représentées par d'autres sélecteurs simples ou par des combinateurs.

Veuillez noter que le texte seul PCDATA n'est pas compté lors du calcul de la position d'un élément dans la liste des enfants de son parent. Lors du calcul de la position d'un élément dans la liste des enfants de son parent, la numérotation commence à 1.

##### La pseudo-classe :root

La pseudo-classe `:root` représente un élément qui est la racine du document. En HTML 4, il s'agit de l'élément `html`. En XML, c'est ce qui est spécifié par la DTD, le schéma, l'espace de noms pour le document XML en question.

##### La pseudo-classe :nth-child()

La notation de pseudo-classe `:nth-child(an+b)` représente un élément qui a an+b-1 éléments frères devant lui dans l'arbre documentaire, pour une valeur entière positive ou nulle de n. En d'autres mots, cela sélectionne chaque b-ième fils d'un élément après que tous ses enfants aient été séparés en groupes de a éléments chacun. Par exemple, cela permet de sélectionner les lignes paires dans un tableau, et peut être utilisé, par exemple, pour alterner la couleur du texte d'un paragraphe sur quatre couleurs. Les valeurs de a et b doivent être des entiers négatifs, positifs ou nuls. L'index du premier enfant d'un élément esr 1.

De plus, `:nth-child()` peut prendre pour argument 'odd' et 'even'. 'odd' a la même signification que 2n+1, et 'even' a la même signification que 2n.

Exemples:

    tr:nth-child(2n+1) /* represents every odd row of a HTML table */
    tr:nth-child(odd)  /* same */
    tr:nth-child(2n)   /* represents every even row of a HTML table */
    tr:nth-child(even) /* same */

    /* Alternate paragraph colours in CSS */
    p:nth-child(4n+1) { color: navy; }
    p:nth-child(4n+2) { color: green; }
    p:nth-child(4n+3) { color: maroon; }
    p:nth-child(4n+4) { color: purple; }

Lorsque a=0, il n'y a pas de répétition, et donc par exemple `:nth-child(0n+5)` représente uniquement le cinquième enfant. Quand a=0, la partie a n'est pas obligatoire, et la syntaxe se simplifie alors en `:nth-child(b)`, l'exemple précédent devenant `:nth-child(5)`.

Autres exemples:

    foo:nth-child(0n+1)   /* represents an element foo, first child of its parent element */
    foo:nth-child(1)      /* same */

Quand a=1, le nombre peut être omis.

Les exemples suivants sont donc équivalents :

    bar:nth-child(1n+0)   /* represents all bar elements, specificity (0,1,1) */
    bar:nth-child(n+0)    /* same */
    bar:nth-child(n)      /* same */
    bar                   /* same but lower specificity (0,0,1) */

Si b=0, alors tous les éléments dont l'index est multiple de a sont sélectionnés.
Par exemple :

    tr:nth-child(2n) /* represents every even row of a HTML table */

Si a et b sont tous deux égaux à 0, la pseudo-classe ne représente aucun élément dans l'arbre documentaire.

La valeur a peut être négative, mais seules les valeurs positives de an+b, pour n=0, peuvent représenter un élément dans l'arbre documentaire, bien entendu.

Par exemple:

    html|tr:nth-child(-n+6)  /* represents the 6 first rows of XHTML tables */

##### La pseudo-classe :nth-last-child()

La notation de pseudo-classe `:nth-last-child(an+b)` représente un élément qui an+b-1 frères après lui dans l'arbre documentaire, pour une valeur entière positive ou nulle de n. Voyez la pseudo-classe `:nth-child()` pour la syntaxe de son argument. Elle accepte également les valeurs 'even' et 'odd' pour argument.

Exemples:

    tr:nth-last-child(-n+2)    /* represents the two last rows of a HTML table */

    foo:nth-last-child(odd)    /* represents all odd foo elements in their parent element,
                                  counting from the last one */

##### La pseudo-classe :nth-of-type()

La notation de pseudo-classe `:nth-of-type(an+b)` représente un élément qui a an+b-1 frères du même type d'élément devant lui dans l'arbre documentaire, pour une valeur entière positive ou nulle de n. En d'autres mots, cela sélectionne chaque b-ième fils du type d'élément donné d'un élément après que tous ses enfants aient été séparés en groupes de a éléments chacun. Voyez la pseudo-classe `:nth-child()` pour la syntaxe de son argument. Elle accepte également les valeurs 'even' et 'odd' pour argument.

Par exemple, cela permet en CSS d'alterner la position des images flotantes :

    img:nth-of-type(2n+1) { float: right; }
    img:nth-of-type(2n) { float: left; }

##### La pseudo-classe :nth-last-of-type()

La notation de pseudo-classe `:nth-last-of-type(an+b)` représente un élément qui a an+b-1 frères du même type d'élément après lui dans l'arbre documentaire, pour une valeur entière positive ou nulle de n. Voyez la pseudo-classe `:nth-child()` pour la syntaxe de son argument. Elle accepte également les valeurs 'even' et 'odd' pour argument.

Par exemple, pour représenter tous les `h2` fils d'un élément XHTML `body` sauf le premier et le dernier, on pourra écrire le sélecteur suivant :

    body > h2:nth-of-type(n+2):nth-last-of-type(n+2)

Dans ce cas, on peut aussi utiliser `:not()`, malgré que le sélecteur ne soit pas moins long :

    body > h2:not(:first-of-type):not(:last-of-type)

##### La pseudo-classe :first-child

Identique à`:nth-child(1)`. La pseudo-classe `:first-child` représente un élément qui est le premier fils d'un autre élément.

Exemple(s):

Dans l'exemple qui suit, le sélecteur représente un élément `p` qui est le premier fils d'un élément `div`.

    div > p:first-child

Ce sélecteur peut représenter un `p` à l'intérieur d'un `div` du fragment suivant ::

    <p> The last P before the note.</p>
    <div class="note">
       <p> The first P inside the note.</p>
    </div>

mais ne peut pas représenter le second `p` du fragment suivant :

    <p> The last P before the note.</p>
    <div class="note">
       <h2>Note</h2>
       <p> The first P inside the note.</p>
    </div>

Les deux sélecteurs qui suivent sont équivalents :

    * > a:first-child   /* a is first child of any element */
    a:first-child       /* Same */

##### La pseudo-classe :last-child

Identique à `:nth-last-child(1)`. La pseudo-classe `:last-child` pseudo-class représente un élément qui est le dernier fils d'un autre élément.

Exemple:

Le sélecteur suivant représente une entrée de liste `li` qui est le dernier enfant d'une liste ordonnée `ol`.

    ol li:last-child

##### La pseudo-classe :first-of-type

Identique à `:nth-of-type(1)`. La pseudo-classe `:first-of-type` pseudo-class représente un élément qui est le premier enfant de son type dans la liste des enfants de son élément parent.

Exemple:

Le sélecteur qui suit représente un titre de définition `dt` à l'intérieur d'une liste de définitions `dl`, cette `dt` étant le premier enfant de son type dans la liste des enfants de l'élément parent.

    dl dt:first-of-type

C'est une description valide pour les deux premiers `dt` dans l'exemple qui suit mais pas pour le troisième ::

    <dl><dt>gigogne</dt>
            <dd><dl><dt>fus&eacute;e</dt>
                        <dd>multistage rocket</dd>
                    <dt>table</dt>
                        <dd>nest of tables</dd>
                </dl></dd>
    </dl>

##### La pseudo-classe :last-of-type

Identique à `:nth-last-of-type(1)`. La pseudo-classe `:last-of-type` pseudo-class représente un élément qui est le premier enfant de son type dans la liste des enfants de son élément parent.

Exemple:

Le sélecteur suivant représente la dernière cellule de données `td` d'une ligne de tableau..

    tr > td:last-of-type

##### La pseudo-classe :only-child

Représente un élément qui n'a aucun frère. Identique à `:first-child:last-child` ou `:nth-child(1):nth-last-child(1)`, mais avec une spécificité inférieure.

##### La pseudo-classe :only-of-type

Représente un élément qui n'a pas de frère avec le même nom d'élément. Identique à `:first-of-type:last-of-type` or `:nth-of-type(1):nth-last-of-type(1)`, mais avec une spécificité inférieure.

##### :empty pseudo-class

La pseudo-classe `empty` représente un élément qui n'a aucun enfant, y compris les noeuds textuels.

Exemples:

`p:empty` est une représentation valide du fragment ci-dessous :

    <p></p>

`foo:empty` n'est pas une représentation valide des fragments ci-dessous :

    <foo>bar</foo>

    <foo><bar>bla</bar></foo>

    <foo>this is not <bar>:empty</bar></foo>

#### 6.6.6 La pseudo-classe de contenu

La notation de pseudo-classe `:contains("foo")` représente un élément dont le contenu textuel contient la sous-chaîne donnée. L'argument de cette pseudo-classe peut être une chaîne de caractères (entourée par des guillemets) ou un mot-clé.

L'usage de la pseudo-classe de contenu est restreint aux media statiques.

Le contenu textuel d'un élément donné est déterminé par la concaténation de tous les PCDATA contenus dans l'élément et ses sous-éléments.

Exemple:

    p:contains("Markup")

est une description correcte et valide, mais partielle, de :

    <p><strong>H</strong>yper<strong>t</strong>ext
       <strong>M</strong><em>arkup</em>
       <strong>L</strong>anguage</p>

Des caracatères spéciaux peuvent être insérés dans l'argument de la pseudo-classe de contenu par usage du mécanisme d'échappement pour les caractères Unicode et caractères spéciaux.

Note : `:contains()` est une pseudo-classe, pas un pseudo-élément. La règle CSS suivante appliquée au fragment HTML ci-dessus n'ajoutera pas un fond rouge au seul mot "Markup" mais ajoutera ce fond à tout le paragraphe.

    P:contains("Markup") { background-color : red }

#### 6.6.7 La pseudo-classe de negation

La pseudo-classe de négation est une notation fonctionnelle prenant un sélecteur simple (à l'exclusion de la pseudo-classe de négation elle-même) pour argument. Elle représente un élément qui n'est pas représenté par l'argument.

Exemple(s) :

Le sélecteur CSS suivant sélectionne tous les éléments `button` qui ne sont pas désactivés dans un document HTML :

    button:not([DISABLED])

Le sélecteur suivant représente tous les éléments sauf les éléments `FOO` :

    *:not(FOO)

Le groupe de sélecteurs suivant représente tous les éléments sauf les liens HTML :

    html|*:not(:link):not(:visited)

Note: la pseudo-classe `:not()` permet d'écrire des sélecteurs inutiles. Par exemple, `:not(*|*)`, qui ne représente aucun élément du tout, or `foo:not(bar)`, qui est équivalent à `foo` mais avec une spécificité supérieure.

### 7. Pseudo-éléments

Les pseudo-éléments créent des abstractions hors de l'arbre documentaire qui ne sont pas spécifiables par le langage de documents. Par exemple, les langages de documents n'offrent aucun moyen d'accéder à la première lettre ou la première ligne du contenu d'un élément. Les pseudo-éléments permettent aux auteurs de se référer à ces données inaccessibles autrement. Les pseudo-éléments peuvent aussi fournir aux auteurs un moyen de se référer à du contenu qui n'existe pas dans le source du document (par exemple, les pseudo-éléments `:before` et `:after` donnent accés au contenu généré).

Un pseudo-élément est formé de deux deux-points (`::`) suivis du nom du pseudo-élément.

Attention : cette notation `::` est introduite par le présent document dans le but d'établir une discrimination entre les pseudo-classes et les pseudo-éléments. Pour des raisons de compatibilité avec les feuilles de styles existantes, les Agents Utilisateurs doivent aussi accepter la notation précédente avec un seul deux-points. Cepedant cette compatibilité n'est pas requise pour les nouveaux pseudo-élémentsp introduits dans CSS level 3.

Les pseudo-éléments peuvent apparaître une fois seulement dans la séquence de sélecteurs simples représentant les sujets du sélecteur.

Les noms des pseudo-éléments sont insensibles à la casse.

#### 7.1 Le pseudo-élément ::first-line

Le pseudo-élément `::first-line` décrit la première ligne formatée d'un élément.

Par exemple en CSS :

    p::first-line { text-transform: uppercase }

La règle ci-dessus signifie "changer les lettres de la première ligne de chaque paragraphe en majuscules". Cependant, le sélecteur `p::first-line` ne sélectionne aucun élément HTML réel. Il sélectionne un pseudo-élément que les Agents Utilisateurs conformes vont insérer au début de chaque paragraphe.

Veuillez noter que la longueur de la première ligne dépend d'un grand nombre de facteurs, y compris de la largeur de la page, la taille de fonte, etc. Ainsi, dans un paragraphe HTML ordinaire tel que :

    <p>This is a somewhat long HTML
    paragraph that will be broken into several
    lines. The first line will be identified
    by a fictional tag sequence. The other lines
    will be treated as ordinary lines in the
    paragraph.</p>

les lignes qui seront découpées de la manière suivante :

    THIS IS A SOMEWHAT LONG HTML PARAGRAPH THAT
    will be broken into several lines. The first
    line will be identified by a fictional tag
    sequence. The other lines will be treated as
    ordinary lines in the paragraph.

peuvent être "réécrites" par les Agents Utilisateurs pour y inclure la séquence de balises fictives pour `::first-line`. Cette séquence de balises fictives aide à montrer comment les propriétés sont héritées.

    <p><p::first-line> This is a somewhat long HTML
    paragraph that will </p::first-line> be broken into several
    lines. The first line will be identified
    by a fictional tag sequence. The other lines
    will be treated as ordinary lines in the
    paragraph.</p>

Si un pseudo-element scinde un élément réel, l'effet désiré peut souvent être décrit par une séquence de balises fictives qui ferme et ré-ouvre l'élément. Ainsi, si l'on balise le paragraphe précédent avec un élément `span` :

    <p><span class="test"> This is a somewhat long HTML
    paragraph that will be broken into several
    lines.</span> The first line will be identified
    by a fictional tag sequence. The other lines
    will be treated as ordinary lines in the
    paragraph.</p>

l'Agent Utilisateur pourra générer les balises de début et de fin appropriées pour `span` lors de l'insertion de la séquence de balises fictives pour `::first-line`.

    <p><p::first-line><span class="test"> This is a
    somewhat long HTML
    paragraph that will </span></p::first-line><span class="test"> be
    broken into several
    lines.</span> The first line will be identified
    by a fictional tag sequence. The other lines
    will be treated as ordinary lines in the
    paragraph.</p>

Le pseudo-élément `::first-line` ne peut être attaché qu'à des éléments de niveau bloc.

Le pseudo-élément `::first-line` est similaire à un élément de niveau flot de texte, mais avec certaines restrictions, en fonction de l'usage. Seules les propriétés suivantes s'appliquent aux pseudo-éléments `::first-line` : propriétés de fontes, propriétés de couleurs, 'word-spacing', 'letter-spacing', 'text-decoration', 'vertical-align', 'text-transform', 'line-height', 'text-shadow', et 'clear'.

#### 7.2 Le pseudo-élément ::first-letter

Le pseudo-élément `::first-letter` la première lettre formatée d'un élément.

Le pseudo-élément `::first-letter` peut être attaché à tout élément.

Le pseudo-élément `::first-letter` peut être utilisé pour des "initiales en capitales" et des "lettrines", qui sont des effets typographiques usuels. Ce type de lettre initiale est similaire à un élément de niveau flot de texte si sa propriété CSS 'float' a pour valeur 'none', mais avec certaines restrictions, en fonction de l'usage. Autrement, il est similaire à un élément flottant.

Voici les propriétés CSS qui s'appliquent aux pseudo-éléments `::first-letter` : propriétés de fontes, propriétés de couleurs, propriétés de fonds, 'text-decoration', 'vertical-align' (seulement si 'float' est 'none'), 'text-transform', 'line-height', propriétés de marges externes, propriétés de marges internes, propriétés de cadres, 'float', 'text-shadow', et 'clear'.

L'exemple CSS 2 suivant génèrera une initiale "lettrine" courant sur deux lignes :

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN">
    <HTML>
     <HEAD>
      <TITLE>Drop cap initial letter</TITLE>
      <STYLE type="text/css">
       P               { font-size: 12pt; line-height: 12pt }
       P::first-letter { font-size: 200%; font-style: italic;
                         font-weight: bold; float: left }
       SPAN            { text-transform: uppercase }
      </STYLE>
     </HEAD>
     <BODY>
      <P><SPAN>The first</SPAN> few words of an article
        in The Economist.</P>
     </BODY>
    </HTML>

Cet exemple pourra être formaté de la manière qui suit :

La séquence de balises fictives est :

    <P>
    <SPAN>
    <P::first-letter>
    T
    </P::first-letter>he first
    </SPAN>
    few words of an article in the Economist.
    </P>

Veuillez noter que les balises du pseudo-élément `::first-letter` entourent le contenu (i.e. le caractère initiale), alors que la balise de début de `::first-line` est insérée immédiatement la balise de début de l'élément auquel il est attaché.

Pour réaliser le formatage traditionnel des "lettrines", les Agents Utilisateurs pourront approximer les tailles de fontes, par exemple pour aligner les lignes de base. De même, le contour des glyphes peut être pris en compte lors du formatage.

Les ponctuations (c'est-à-dire les caractères définis dans Unicode [UNICODE] dans les classes de ponctuation "open" (Ps), "close" (Pe), et "other" (Po)), qui précèdent la première lettre doivent être incluses, comme dans :

Le pseudo-élément `::first-letter` sélectionne des parties d'élément seulement.

Quelques langues ont des règles spécifiques de traitement de certaines combinaisons de lettres. En Néerlandais, par exemple, si la combinaison de lettres "ij" apparait en début de mot, les deux lettres doivent être prises en compte dans le pseudo-élément `::first-letter`.

L'exemple suivant illustre comment des pseudo-éléments superposés peuvent interagir. La première lettre de chaque élément `P` sera verte avec une taille de fonte de '24pt'. Le reste de la première ligne formatée sera 'blue' alors que le reste du paragraphe sera 'red'.

    P { color: red; font-size: 12pt }
    P::first-letter { color: green; font-size: 200% }
    P::first-line { color: blue }

    <P>Some text that ends up on two lines</P>

En supposant qu'un saut de ligne se produira avant le mot "ends", la séquence de balises fictives pour ce fragment pourra alors être:

    <P>
    <P::first-line>
    <P::first-letter>
    S
    </P::first-letter>ome text that
    </P::first-line>
    ends up on two lines
    </P>

Veuillez noter que les éléments ::first-letter se trouvent à l'intérieur de l'élément `::first-line`. Les propriétés assignées à `::first-line` sont héritées par `::first-letter`, mais sont surclassées si la même propriété est assignée à `::first-letter`.

#### 7.3 Les pseudo-éléments fragments d'éléments d'interface

##### Le pseudo-élément ::selection

Le pseudo-élément `::selection` s'applique à la portion du document qui a été mise en exergue par l'utilisateur. Cela s'applique aussi, par exemple, au texte sélectionné dans un champ de texte éditable. Seuls les éléments qui ont une propriété 'user-select' différente de 'none' peuvent avoir un `::selection`. Ce pseudo-élément ne doit pas être confondu avec la pseudo-classe `:checked` (qui s'appelait auparavant `:selected`).

Malgré que le pseudo-élément `::selection` soit dynamique par nature, et soit modifié par l'action de l'utilisateur, il est raisonnable de s'attendre à ce que, quand un Agent Utilisateur re-restitue sur un medium statique (comme une page imprimée) ce qui était initialement restitué sur un medium dynamique (comme un écran), l'Agent Utilisateur puisse souhaiter transférer la `::selection` courante à cet autre medium, at disposer de tout le formatage et la restitution appropriés également. Cela n'est pas requis - certains Agents Utilisateurs peuvent omettre le pseudo-élément `::selection` pour les media statiques.

Voici les propriétés CSS qui s'appliquent aux pseudo-éléments `::selection` : couleur, fond, contour. La couleur de 'background-image' sur `::selection` peut être ignorée.

#### 7.4 Les pseudo-éléments ::before et ::after

Les pseudo-éléments `::before` et `::after` peuvent être utilisés pour décrire du contenu généré devant ou après le contenu d'un élément. Ils sont expliqués dans le Module CSS 3 Contenu Généré et Marqueurs (module 14).

Quand les pseudo-éléments `::first-letter` et `::first-line` sont combinés avec `::before` et `::after`, ils 'appliquent à la première lettre iy ligne de l'élément y compris le texte inséré.

## 8. Combinateurs

### 8.1 Combinateur de descendance

Parfois, les auteurs veulent des sélecteurs pour décrire un élément qui est le descendant d'un autre élément dans l'arbre documentaire (par exemple "un élément `EM` qui est contenu dans un élément `H1`") . Les combinateurs de descendance expriment ce type de relation. Un combinateur de descendance est un espace séparant deux séquences de sélecteurs simples. Un sélecteur de la forme "`A B`" représente un élément `B` qui est un descendant quelconque d'un élément ancêtre `A`.

Exemple(s):

Par exemple, considérons le sélecteur suivant :

    h1 em

C'est une description correcte et valide, mais partielle, du fragment suivant :

    <h1>This <span class="myclass">headline
    is <em>very</em> important</span></h1>

Le sélecteur suivant :

    div * p

représente un élément `p` qui est le petit-fils ou un descendant ultérieur d'un élément `div`. Veuillez noter les espaces entourant le "*".

Le sélecteur sui suit, qui combine des sélecteurs de descendance et des sélecteurs d'attributs, représente un élement qui (1) possède l'attribut `href` assigné (2) est à l'intérieur d'un `p` lui-même dans un `div`.

    div p *[href]

### 8.2 Combinateur filial

Un combinateur filial décrit une relation de filiation entre deux éléments. Un combinateur filial est composé du caractère "`>`" et sépare deux séquences de sélecteurs simples.

Exemple(s):

Le sélecteur suivant représente un élément `p` qui est le fils de `body` :

    body > p

Exemple(s):

L'exemple qui suit combine des combinateurs de descendance et des combinateurs filiaux :

    div ol>li p

Il représente un élément `p` qui est le descendant d'un `li` ; l'élément `li` doit être le fils d'un élément `ol` ; l'élément `ol` doit être le descendant d'un `div`. Veuillez noter que les espaces optionnels autour du "`>`" ont été omis.

Pour toute information sur la sélection du premier fils d'un élément, veuillez s'il-vous-plait voir la section sur la pseudo-classe `:first-child` ci-dessus.

### 8.3 Combinateurs d'adjacence

Il y a deux différents combinateurs d'adjacence : le combinateur d'adjacence directe et le combinateur d'adjacence indirecte.

#### 8.3.1 Combinateur d'adjacence directe

Les combinateurs d'adjacence directe sont composés du caractère "`+`" séparant deux séquences de sélecteurs simples. Les éléments représentés par les deux séquences partagent le même parent dans l'arbre documentaire et l'élément représenté par la première séquence précède immédiatement l'élément représenté par la seconde.

Exemple(s):

Ainsi, le sélecteur suivant représente un élément `p` suivant immédiatement un élement `math` :

    math + p

Exemple(s):

Le sélecteur suivant est conceptuellement similaire à celui de l'exemple précédent, à ceci près qu'il ajoute un sélecteur d'attribut. Ainsi, il ajoute une contrainte à l'élément `h1` qui doit avoir `class="opener"` :

    h1.opener + h2

#### 8.3.2 Combinateur d'adjacence indirecte

Les combinateurs d'adjacence indirecte sont composés du caractère "`~`" séparant deux séquences de sélecteurs simples. Les éléments représentés par les deux séquences partagent le même parent dans l'arbre documentaire et l'élément représenté par la première séquence précède (pas nécessairement immédiatement) l'élément représenté par la seconde.

Exemple(s):

    h1 ~ pre

représente un élément `pre` suivant un `h1`. C'est une description correcte et valide, mais partielle, de :

    <h1>Definition of the function a</h1>
    <p>Function a(x) has to be applied to all figures in the table.</p>
    <pre>function a(x) = 12x/13.5</pre>

## 9. Calcul de la spécificité d'un sélecteur

La spécificité d'un sélecteur se calcule de la manière suivante :

- les sélecteurs de négation sont comptés comme le sélecteur simple qui est leur argument
- comptez le nombre d'attributs ID dans le sélecteur (=a)
- comptez le nombre d'autres attributs et de pseudo-classes dans le sélecteur (=b)
- comptez le nombre de noms d'éléments dans le sélecteur (= c)
- ignorez les pseudo-éléments.

La concaténation des trois nombres a-b-c (dans un système de numération avec une grande base) fournit la spécificité.

Exemple(s):

Quelques exemples:

    *               /* a=0 b=0 c=0 -> specificity =   0 */
    LI              /* a=0 b=0 c=1 -> specificity =   1 */
    UL LI           /* a=0 b=0 c=2 -> specificity =   2 */
    UL OL+LI        /* a=0 b=0 c=3 -> specificity =   3 */
    H1 + *[REL=up]  /* a=0 b=1 c=1 -> specificity =  11 */
    UL OL LI.red    /* a=0 b=1 c=3 -> specificity =  13 */
    LI.red.level    /* a=0 b=2 c=1 -> specificity =  21 */
    #x34y           /* a=1 b=0 c=0 -> specificity = 100 */
    #s12:not(FOO)   /* a=1 b=0 c=1 -> specificity = 101 */

Note: la spécificité des styles spécifiés dans un attribut HTML `style` est décrite dans le module CSS 3 "Cascade et Héritage".

## 10. La grammaire des sélecteurs W3C

### 10.1 Grammaire

La grammaire ci-dessous définit la syntaxe des sélecteurs W3C. Elle est globalement LL(1) et peut être localement LL(2) (mais veuillez noter que la plupart des Agents Utilisateurs ne devraient pas l'utiliser directement, car elle n'exprime pas les conventions d'analyse). Le format des productions est optimisé pour la compréhension humaine et quelques notations raccourcies de Yacc (voyez [YACC]) sont utilisées :

- *: 0 ou plus
- +: 1 ou plus
- ?: 0 ou 1
- |: sépare des choix
- [ ]: groupe

Les productions sont :

    selectors_group
      : selector [ ',' S* selector ]*
      ;

    selector
      /* there is at least one sequence of simple selectors in a */
      /* selector and the pseudo-elements occur only in the last */
      /* sequence ; only pseudo-element may occur */
      : [ simple_selector_sequence combinator ]*
           simple_selector_sequence [ pseudo_element ]?
      ;

    combinator
      /* combinators can be surrounded by whitespace */
      : S* [ '+' | '>' | '~' | /* empty */ ] S*
      ;

    simple_selector_sequence
      /* the universal selector is optional */
      : [ type_selector | universal ]?
            [ HASH | class | attrib | pseudoclass | negation ]+ |
        type_selector | universal
      ;

    type_selector
      : [ namespace_prefix ]? element_name
      ;

    namespace_prefix
      : [ IDENT | '*' ]? '|'
      ;

    element_name
      : IDENT
      ;

    universal
      : [ namespace_prefix ]? '*'
      ;

    class
      : '.' IDENT
      ;

    attrib
      : '[' S* [ namespace_prefix ]? IDENT S*
            [ [ PREFIXMATCH |
                SUFFIXMATCH |
                SUBSTRINGMATCH |
                '=' |
                INCLUDES |
                DASHMATCH ] S* [ IDENT | STRING ] S*
            ]? ']'
      ;

    pseudoclass
      /* a pseudo-class is an ident, or a function taking an */
      /* ident or a string or a number or a simple selector  */
      /* (excluding negation and pseudo-elements) */
      /* or a an+b expression for argument */
      : ':' [ IDENT | functional_pseudo ]
      ;

    functional_pseudo
      : FUNCTION S* [ IDENT | STRING | NUMBER |
                      expression | negation_arg ] S* ')'
      ;

    expression
      :  [ [ '-' | INTEGER ]? 'n' [ SIGNED_INTEGER ]? ] | INTEGER
      ;

    negation_arg
      : type_selector | universal | HASH | class | attrib | pseudoclass
      ;

    pseudoelement
      : [ ':' ]? ':' IDENT
      ;

### 10.2 Analyseur lexical

Ci-dessous se trouve le tokenizer, écrit en notation Flex (voyez [FLEX]). Le tokenizer est insensible à la casse.

Les deux occurences de "\377" représetent le plus haut numéro de caractère que les versions actuelles de Flex sachent traiter (255 en décimal). Elles doivent être lues "\4177777" (1114111 en décimal), qui est le plus haut code possible dans Unicode/ISO-10646.

    %option case-insensitive

    h                       [0-9a-f]
    nonascii                [\200-\377]
    unicode                 \\{h}{1,6}[ \t\r\n\f]?
    escape                  {unicode}|\\[ -~\200-\377]
    nmstart                 [a-z]|{nonascii}|{escape}
    nmchar                  [a-z0-9-]|{nonascii}|{escape}
    string1                 \"([\t !#$%&(-~]|\\{nl}|\'|{nonascii}|{escape})*\"
    string2                 \'([\t !#$%&(-~]|\\{nl}|\"|{nonascii}|{escape})*\'

    ident                   {nmstart}{nmchar}*
    name                    {nmchar}+
    integer                 [-]?[0-9]+
    signed_integer          [-+][0-9]+
    num                     {integer}|[0-9]*"."[0-9]+
    string                  {string1}|{string2}
    nl                      \n|\r\n|\r|\f
    %%

    [ \t\r\n\f]+    {return S;}

    \/\*[^*]*\*+([^/][^*]*\*+)*\/   /* ignore comments */

    "~="                    {return INCLUDES;}
    "|="                    {return DASHMATCH;}
    "^="                    (return PREFIXMATCH;)
    "$="                    (return SUFFIXMATCH;)
    "*="                    (return SUBSTRINGMATCH;)
    {string}                {return STRING;}
    {ident}                 {return IDENT;}
    {ident}"("              {return FUNCTION;}
    {num}                   {return NUMBER;}
    {signed_integer}        {return SIGNED_INTEGER;}
    {integer]               {return INTEGER;}
    "#"{name}               {return HASH;}

    .                       {return *yytext;}

## 11. Espaces de noms et Outils de bas niveau

Une importante question ouverte est l'interaction entre les sélecteurs CSS et les documents XML dans les clients web qui ont été développés avant le présent document. Malheureusement, parce que les espaces de noms doivent être sélectionnées sur la base de l'URI qui identifie l'espace de noms, et pas sur la base du préfixe d'espace de noms, un mécanisme d'identification des espaces de noms par leur URI est aussi nécessaire en CSS. Sans un tél mécanisme, il est impossible de construire une feuille de styles CSS qui sélectionnera correctement dans tous les cas dans un ensemble quelconque de documents XML. Cependant, avec la connaissance complète du document XML sur lequel s'applique une feuille de styles, et avec un usage limité des espace de noms dans le document XML, il est possible de construire une feuille de styles dans laquelle les sélecteurs sélectionneront correctement les éléments et les attributs.

Il doit être noté qu'un outil CSS de bas niveau (s'il est correctement conforme aux règles d'analyse compatible ascendante CSS) ignore toutes les règles `@namespace`, de même que toutes les règles stylistiques qui font usage des sélecteurs de types ou sélecteurs d'attributs avec espaces de noms. La syntaxe de séparation des préfixes d'espaces de noms en CSS a été délibérément choisie pour que les outils CSS de bas niveau ignorent les règles stylistiques plutôt que de les sélectionner incorrectement.

L'usage de l'espace de noms par défaut en CSS rend possible l'écriture de sélecteurs de types d'élément qui fonctionneront tant dans les outils reconnaissant les espaces de noms que dans les outils de bas niveau. Il doit être noté que les outils de bas niveau peuvent sélectionner incorrectement des éléments XML dans d'autres espaces de noms.

Ci-dessous se trouvent des scenarii et exemples de construction de feuilles de styles qui fonctionneraient correctement dans des clients web n'implémentant pas la présent proposition.

1. Le document XML n'utilise pas les espaces de noms.
   - Dans ce cas, il n'est bien entendu pas nécessaire de déclarer ou d'utiliser des espaces de noms dans la feuille de styles. Des sélecteurs de types et d'attributs classiques fonctionneront correctement dans un client de bas niveau.
   - Dans un client CSS reconnaissant les espaces de noms, le comportement par défaut des sélecteurs d'éléments sélectionnant sans considération pour l'espace de noms suffira pour la sélection de tous les éléments, puisqu'aucun espace de noms n'est présent. Cependant, l'usage de sélecteurs de types d'élément qui sélectionneraient uniquement les éléments qui n'ont pas d'espace de noms ("`|name`") garantira que les sélecteurs sélectionnent uniquement les éléments XML qui n'ont pas d'espace de noms déclaré.
2. Le document XML définit un unique espace de noms par défaut utilisé dans tout le document. Il n'y a pas de préfixe d'espace de noms dans les noms d'éléments.
   - Dans ce cas, un client de bas niveau fonctionnera comme si les espaces de noms n'étaient pas utilisés du tout dans le document. Les sélecteurs standards de type d'élément et d'attributs suffiront pour tous les éléments.
3. Le document XML ne définit pas d'espace de noms par défaut, tous les préfixes d'espaces de noms sont connus de l'auteur de la feuille de styles et il y a un corrélation directe entre les préfixes d'espaces de noms et les URIs d'espaces de noms (un préfixe donné ne peut être associé qu'à un URI d'espace de noms à travers le document XML, il peut y avoir plusieurs préfixes associés au même URI).
   - Dans ce cas, le client de bas niveau montrera et appliquera les sélecteurs de types d'élément et d'attributs sur la base di nom complètement qualifié, et non pas sur la base de la partie locale comme c'est souligné dans la section Sélecteurs de types et Espaces de noms. Le sélecteurs CSS peuvent être déclarés en utilisant un deux-points avec séquence d'échappement "`\:`" pour décrire les noms complètement qualifiés, c'est-à-dire que "`html\:h1`" sélectionnera `<html:h1>`. Les sélecteurs utilisant le nom qualifié ne sélectionneront que les éléments XML utilisant le même préfixe. Les autres préfixes d'espaces de noms utilisés dans le XML qui sont associés au même URI ne sélectionneront pas comme convenu sauf si des règles stylistiques CSS additionnelles sont déclarés pour eux.
   - Veuillez noter que les sélecteurs déclarés de cette manière fonctionneront uniquement dans les outils de bas niveau. Un outil CSS reconnaissant les espaces de noms fera fonctionner les sélecteurs de types d'éléments sur la base de la partie locale du nom.. Et donc les sélecteurs déclarés avec un nom complèetement qualifié ne sélectionneront rien (sauf s'il n'y a pas de préfixe d'espace de noms dans le nom complètement qualifié, bien entendu).

Dans d'autres scenarii : quand les préfixes d'espaces de noms utilisés dans le XML ne sont pas connus d'avance de l'auteur de la feuille de styles ; ou qu'une combinaison d'éléments sans espaces de noms est utilisée en conjonction avec des éléments utilisant un espace de noms par défaut ; ou quand le préfixe d'espace de noms est associé à plusieurs URIs d'espaces de noms dans le même document, ou dans plusieurs documents ; il est impossible de construire une feuille de styles CSS qui fonctionnera correctement avec tous les éléments dans ces documents à moins que la feuille de styles ne soit écrite en utilisant une syntaxe d'URI d'espace de noms (comme signalé par ce document ou similairement) et que ce document soit traité par un client reconnaissant les espaces de noms CSS et XML.

## 12. Profils

Chaque spécification utilisant les Sélecteurs W3C doit définir le sous-ensemble des Sélecteurs W3C qu'elle accepte et exclut, et décrire la signification locale de chacun des composants de ce sous-ensemble.

Exemples non normatifs :

profil Sélecteurs W3C
Spécification | CSS level 1
Accepte | sélecteurs de types sélecteurs de classes sélecteurs d'ID pseudo-classes :link, :visited et :active combinateur de descendance pseudo-éléments :first-line et :first-letter
Exclut | sélecteur universel sélecteurs d'attributs pseudo-classes :hover et :focus pseudo-classe :target pseudo-classe :lang() toutes les pseudo-classes d'état d'élément d'interface toutes les pseudo-classes structurelles pseudo-classe :contains() pseudo-classe de negation tous les pseudo-éléments de fragments d'élément d'interface les pseudo-éléments ::before et ::after combinateur filial combinateurs d'adjacence espaces de noms
Contraintes supplémentaires | un seul sélecteur de classe autorisé par séquence de sélecteurs simples

profil Sélecteurs W3C
Spécification | CSS level 2
Accepte | sélecteurs de types sélecteur universel sélecteurs de présence et de valeurs d'attributs sélecteurs de classe sélecteurs d'ID pseudo-classes :link, :visited, :active, :hover, :focus, :lang() et :first-child combinateur de descendance combinateur filial combinateur d'adjacence directe pseudo-éléments ::first-line et ::first-letter pseudo-éléments ::before et ::after
Exclut | Sélecteurs de sous-chaîne dans la valeur d'un attribut pseudo-classe :target toutes les pseudo-classes d'état d'élément d'interface toutes les pseudo-classes structurellesautre que :first-child pseudo-classe :contains() pseudo-classe de négation tous les pseudo-éléments de fragments d'élément d'interface combinateur d'adjacence indirecte espace de noms
Contraintes supplémentaires | plus d'un sélecteur de classe autorisé par séquence de sélecteurs simples (contrainte CSS 1)

En CSS, les sélecteurs expriment des règles de sélection sur modèle qui déterminent quelles règles stylistiques s'appliquent aux éléments dans l'arbre documentaire.

Le sélecteur suivant (CSS level 2) sélectionnera toutes les ancres `a` portant un attribut `href` et étant à l'intérieur d'un titre de section de niveau 1 `h1` :

    h1 a[name]

Toutes les déclarations CSS attachées à un tel sélecteur s'appliqueront aux éléments le vérifiant.

Exemple non normatif :

profil Selecteurs W3C
Spécification | STTS
Accepte | sélecteurs de types sélecteur universel sélecteurs d'attribut sélecteurs de classes sélecteurs d'ID toutes les pseudo-classes structurelles pseudo-classe :contains() tous les combinateurs espaces de noms
Exclut | pseudo-classes non acceptées pseudo-éléments
Contraintes supplémentaires | quelques sélecteurs et combinateurs ne sont pas autorisés dans les descriptions de fragments dans la partie droite des déclarations STTS.

En STTS, les sélecteurs W3C peuvent être utilisés de deux différentes manières :

1. un mécanisme de sélection équivalent à celui des CSS : les déclarations attachées à un sélecteur donné sont appliquées aux éléments vérifiant ledit sélecteur,
2. des descriptions de fragments qui apparaissent sur la partie droite des déclarations.

## 13. Conformité et Critères de convergence

Cette section définit la conformité à la présente spécification.

L'incapacité d'un Agent Utilisateur à implémenter une partie de cette spécifications due aux limitations d'un périphérique particulier (par exemple, les Agents Utilisateurs non interactifs ne vont probablement pas implémenter les pseudo-classes dynamiques car elles ne n'ont pas de sens sans interactivité) n'implique pas la non-conformité.

Toute spécification réutilisant les Sélecteurs W3C doit contenir un Profil détaillant le sous-ensemble des Sélecteurs W3C qu'elle accepte et exclut, et décrivant les contraintes qu'elle ajoute à la présente spécification.

Les Agents Utilisateurs doivent respecter les règles de gestion des erreurs d'analyse :

- un sélecteur contenant un sélecteur simple invalide, un combinateur invalide ou un mot-clé invalide est invalide.
- un groupe de sélecteurs contenant un sélecteur invalide est invalide.

## 14. Tests

Cette spécification contient une suite de tests permettants aux Agents Utilisateurs de vérifier leur conformité de base à cette spécification. Cette suite de tests ne prétend pas être exhaustive et ne couvre pas tous les usages combinés possibles des Sélecteurs W3C.

Ces tests sont disponibles [lien à venir].

## 15. Remerciements

Cette spécificiation est le produit du Groupe de Travail du W3C sur les Cascading Style Sheets et Propriétés de Formatage. S'ajoutant aux éditeurs de cette spécification, les membres du Groupe de Travail sont :

- Marc Attinasi (Netscape/AOL)
- Bert Bos (W3C)
- Tantek Çelik (Microsoft Corp.)
- Don Day (IBM)
- Martin Dürst (W3C)
- Angel Diaz (IBM)
- Daniel Glazman (Netscape/AOL depuis nov. 2000, et Electricité de France jusqu'en fév. 2000)
- Håkon W. Lie (Opera Software depuis avril 1999, and W3C jusqu'en avril 1999)
- Chris Lilley (W3C)
- Dave Raggett (W3C/Openwave Systems Inc.)
- Pierre Saslawsky (Netscape/AOL)
- Michel Suignard (Microsoft Corp.)
- Ted Wugofski (Openwave Systems Inc.)
- Steve Zilles (Adobe)

Plusieurs experts invités dans le Groupe de Travail ont contribué de manière significative aux CSS 3 : David. L Baron, Tim Boland (NIST), Todd Fahrner, Daniel Glazman, Ian Hickson, Eric Meyer (The OPAL Group), Jeff Veen.

Anciens membres du Groupe de Travail :

- Chris Brichford (Adobe)
- Troy Chevalier (Netscape/AOL)
- Dwayne Dicks (Softquad)
- Ian Jacobs (W3C)
- Lorin Jurow (Quark)
- Sho Kuwamoto (Macromedia)
- Peter Linss (Netscape/AOL)
- Steven Pemberton (W3C)
- Robert Pernett (Lotus)
- Douglas Rand (SGI)
- Nisheeth Ranjan (Netscape/AOL)
- Ed Tecot (Microsoft Corp.)
- Jared Sorensen (Novell)
- Robert Stevahn (Hewlett-Packard)
- Mike Wexler (Adobe)
- John Williams (Quark)
- Chris Wilson (Microsoft Corp.)

Nous les remercions tous (membres, experts invités et anciens membres) pour leurs efforts.

Bien entendu, ce document dérive des Recommandations CSS Level 1 et CSS Level 2. Nous remercions tous les auteurs, éditeurs et contributeurs de/aux CSS 1 et CSS 2.

Le Dr. Hasan Ali Çelik a suggéré la simple et puissante syntaxe de l'argument de `:nth-child()` alors que le Groupe de Travail s'orientait vers ses solutions bien plus complexes.

Les discussions tenues en `www-style@w3.org` ont eu beaucoup d'influence sur de nombreux points critiques. En particulier, nous voudrions remercier Ian Hickson, Ian Graham, David Baron, Björn Höhrmann, fantasai, Jelks Cabanis et Matthew Brealey pour leur participation active et utile.

## 16. Références

1. [CSS1] Bert Bos, Håkon Wium Lie; "Cascading Style Sheets, level 1", W3C Recommendation, 17 Déc 1996, révisée 11 Jan 1999
   (`http://www.w3.org/TR/REC-CSS1`)
2. [CSS2] Bert Bos, Håkon Wium Lie, Chris Lilley, Ian Jacobs, editors; "Cascading Style Sheets, level 2", W3C Recommandation, 12 Mai 1998
   (`http://www.w3.org/TR/REC-CSS2`)
3. [UNICODE] "The Unicode Standard: Version 3.0.1", The Unicode Consortium, Addison Wesley Longman, 2000, ISBN 0-201-61633-5.
   URL: http://www.unicode.org/unicode/standard/versions/Unicode3.0.1.html.
   La dernière version de Unicode. Pour plus d'informations, consultez la page d'acceuil du Consortium Unicode en `http://www.unicode.org/`.
4. [STTS3] Daniel Glazman ; "Simple Tree Transformation Sheets 3", Electricité de France, soumission au W3C, 11 Nov 1998
   (`http://www.w3.org/TR/NOTE-STTS3`)
5. [ACTIONS] Vidur Apparao, Brendan Eich, Ramanathan Guha, Nisheeth Ranjan ; "Action Sheets : a Modular Way of Defining Behavior for XML and HTML", Netscape Communications Corp., soumission au W3C, 19 Juin 1998
   (`http://www.w3.org/TR/NOTE-AS`)
6. [UI] Tantek Çelik, editor; "User Interface for CSS3", W3C Working Draft, 16 Février 2000
   (`http://www.w3.org/TR/2000/WD-css3-userint-20000216`)
7. [NMSP] Peter Linss, editor; "CSS Namespace Enhancements (Proposal)", W3C Working Draft, 25 Juin 1999
   (`http://www.w3.org/1999/06/25/WD-css3-namespace-19990625/`)