Sélecteurs CSS3

CSS3 donne accès à une grande variété de sélecteurs que vous utilisez pour identifier quel élément pour formater sur une page. Un sélecteur définit ce qu'il faut FORMAT- le style définit comment formater. Cependant, il est facile d'aller dans la surcharge de sélection. La plupart des développeurs utilisent une combinaison de balises et attributs sélecteurs pour effectuer toutes les tâches lié au sélecteur. Voici les sélecteurs de balises couramment utilisés, qui offrent des méthodes de sélection globales.

• Balise,Balise: Séparant deux étiquettes par une virgule signifie sélectionnant les deux balises, indépendamment du lieu où ils apparaissent dans le document. Par exemple, en utilisant p, div serait tout sélectionner

  et

  balises dans le document.

• Balise>Balise: Séparant deux étiquettes avec un signe supérieur (>) Raconte le navigateur pour sélectionner une étiquette qui a autre balise en tant que parent. Par exemple, si vous avez

  et l'utilisation div> p, le navigateur va sélectionner le

  tag.

• Balise Balise: Séparant deux balises par un espace raconte le navigateur pour sélectionner une étiquette qui apparaît dans une autre balise. Ce sélecteur diffère de l'aide d'un signe supérieur à ce que la première balise ne doit pas apparaître immédiatement juste avant la deuxième étiquette. Par exemple, si vous avez

  et l'utilisation div> p, le navigateur ne rien sélectionner. Toutefois, si vous utilisez div p à la place, le navigateur va sélectionner le

  tag.

• Balise+Balise: Séparant deux étiquettes avec un signe plus (+) Raconte le navigateur pour sélectionner une étiquette qui apparaît immédiatement après une autre balise. Par exemple, si vous avez

  
  
  
  
  

  et l'utilisation div + p, le navigateur va sélectionner le

  tag. Notez que le

  tag ne semble pas dans le

  tag, il apparaît après la
  tag.

• Balise~Balise: Séparant deux étiquettes avec un tilde (~) Raconte le navigateur pour sélectionner chaque balise qui apparaît après une autre balise. Par exemple, si vous avez

  et l'utilisation div ~ p, le navigateur va sélectionner à la fois

  balises. Cela diffère de div + p (où le navigateur ne sélectionner que le premier

  tag qui suit le

  tag).

• : root: Sélectionne l'élément racine du document. L'élément racine est fonction du type de document. Ce sélecteur est normalement utilisé avec des documents XML, mais vous pourrait l'utiliser avec n'importe quel type de document.

Afin de fournir belle sélection de juste les bons éléments, les développeurs utilisent souvent des sélecteurs d'attributs en place des balises sélecteurs. Voici les sélecteurs d'attributs que les développeurs utilisent couramment.

• .Nom de la classe: Sélectionne tous les objets qui ont une classe valeur de l'attribut avec le nom donné. Par example, .StdPara serait de sélectionner chaque objet qui a une class = "StdPara" attribuer, sans égard pour le type d'objet.

• #id: Sélectionne tous les objets qui ont une id valeur de l'attribut avec le nom donné. Par example, #ThirdHeader serait de sélectionner chaque objet qui a une id = "ThirdHeader" attribuer, sans égard pour le type d'objet.

• : lang (Langue Identifier): Sélectionne un objet avec la valeur de langue spécifié. Par example, : lang (fr) serait de sélectionner un objet qui utilise l'anglais comme langue. Voici une liste d'identificateurs de langage commun.

• [Attribut]: Sélectionne tous les objets qui utilisent un attribut particulier, indépendamment de la valeur de l'attribut. Par example, [lang] serait de sélectionner tous les objets qui utilisent le lang attribuer.

• [Attribut=Valeur]: Sélectionne tous les objets qui ont un attribut avec une valeur particulière. La valeur doit correspondre précisément. Par example, [lang = "fr-fr"] serait de sélectionner chaque objet possède un attribut de langue avec une valeur de Anglais.

• [Attribut~ =Valeur]: Sélectionne tous les objets qui ont un attribut qui contient une valeur particulière. La valeur de recherche ne doit figurer quelque part dans la valeur dans son ensemble. Par example, [title = ~ "secondaire"] sélectionne tous les objets avec des attributs de titre qui contiennent le mot Secondaire comme un mot discret. Ce sélecteur fonctionne avec des mots entiers.

• [Attribut| =Valeur]: Sélectionne tous les objets qui ont un attribut qui commence avec une valeur particulière. La valeur de recherche doit apparaître au début de la valeur dans son ensemble, mais ne doit pas être la valeur entière. Par example, [titre | = "Sub"] sélectionne tous les objets avec des attributs de titre qui commencent par le mot Sous. Ce sélecteur fonctionne avec termes composés.

• [Attribut^ =Valeur]: Sélectionne tous les objets qui ont un attribut qui commence avec une valeur particulière. Par example, [titre | = "Sub"] sélectionne tous les objets avec des attributs de titre qui commencent par le mot Sous. Cette forme de la sélection est moins restrictive que la [Attribut | = Valeur] attribuer. Utilisation de ce formulaire sélectionnez title = "Sous-en", title = "Sous-tête", ou title = "Sous-tête" avec la même fiabilité.

• [Attribut$ =Valeur]: Sélectionne tous les objets qui ont un attribut qui se termine avec une valeur particulière. Par example, [titre $ = "secondaire"] sélectionne tous les objets avec des attributs de titre qui se terminent par le mot Secondaire. Cette forme de l'attribut est non limitative - il ne requiert aucun formatage spécial.

• [Attribut* =Valeur]: Sélectionne tous les objets qui ont un attribut qui contient une valeur particulière. Par example, [titre $ = "secondaire"] sélectionne tous les objets avec des attributs de titre qui contiennent le mot Secondaire. Cette forme de la sélection est moins restrictive que la [Attribut~ =Valeur] attribuer. Utilisation de ce formulaire select title = "SecondaryParagraph", title = "Paragraphe secondaire", ou title = "secondaire-paragraphe" avec la même fiabilité.

Une spéciale pas() sélecteur complète la gamme commune de sélecteurs. Pour dire au navigateur de ne pas sélectionner une étiquette ou un attribut particulier, mais pour sélectionner tout le reste à la place, vous utilisez le : non () sélecteur. Par example, : non (p) serait de sélectionner tout, mais les balises de paragraphe sur la page.