Quels sont les sélecteurs de base du CSS ?

Les sélecteurs de base de CSS sont utilisés pour faire correspondre les éléments dans les documents HTML, notamment : le sélecteur de type (nom d'élément correspondant) ; le sélecteur de classe (nom de classe correspondant) ; le sélecteur de descendant (ID correspondant) ; à l'intérieur ; Sélecteur d'élément enfant (correspond aux éléments enfants directs) ; Sélecteur frère adjacent (correspond aux éléments frères directement adjacents) ;

Sélecteurs de base en CSS

Les sélecteurs de base en CSS sont utilisés pour faire correspondre les éléments d'un document HTML. En utilisant ces sélecteurs, vous pouvez spécifier des styles pour des éléments spécifiques.

Sélecteur de type

• element: correspond à tous les éléments avec le nom d'élément spécifié, par exemple,psignifie tous les paragraphes.element：匹配带有指定元素名的所有元素，例如p表示所有段落。

类选择器

• .class-name：匹配具有指定类名的所有元素，例如.example表示所有带有example类的元素。

ID 选择器

• #id-name：匹配具有指定 ID 的单个元素，例如#header表示带有headerID 的元素。

后代选择器

• ancestor descendant：匹配位于祖先元素内的后代元素，例如ul li表示所有位于ul元素内的li元素。

子元素选择器

• parent > child：匹配作为父元素直接子元素的子元素，例如div > p表示所有直接位于div元素内的p元素。

相邻兄弟选择器

• element + adjacent：匹配直接出现在指定元素之后的相邻元素，例如p + h2表示所有直接位于p元素之后的h2元素。

通用兄弟选择器

• element ~ sibling：匹配所有出现在指定元素之后的兄弟元素，包括相邻元素和更远的元素，例如h1 ~ p表示所有位于h1元素之后的p元素。

属性选择器

• [attribute]：匹配具有指定属性的元素，例如[href]表示所有具有href属性的元素。
• [attribute=value]：匹配具有指定属性并具有指定值的元素，例如[href="example.com"]表示所有href

Sélecteur de classe .class-name: correspond à tous les éléments avec le nom de classe spécifié, par exemple, .examplesignifie tous les éléments avec exemple Éléments de la classe. Sélecteur d'ID #id-name: correspond à un seul élément avec l'ID spécifié, par exemple, #headersignifie avec header élément d'identification. Sélecteur de descendantdescendant ancêtre: correspond aux éléments descendants situés dans les éléments ancêtres, par exemple, ul lisignifie tous les éléments situés dans ul élément lidans l'élément. Sélecteur d'élément enfant parent > child: correspond aux éléments enfants qui sont des enfants directs de l'élément parent, par exemple, div > preprésente all direct Un élément psitué dans un élément div. Sélecteur de frères et sœurs adjacents element + adjacent: correspond aux éléments adjacents qui apparaissent directement après l'élément spécifié, tels que p + h2signifie que tous sont directs. Le h2qui suit l'élément p. Sélecteur universel de frères et sœurs element ~ sibling: correspond à tous les éléments frères qui apparaissent après l'élément spécifié, y compris les éléments adjacents et d'autres éléments, tels que h1 ~ p code> représente tous les éléments pqui suivent l'élément h1. Sélecteur d'attribut [attribute]: correspond aux éléments avec des attributs spécifiés, tels que [href]signifie tous les éléments avec hrefattribut de l'élément. [attribute=value]: fait correspondre les éléments avec l'attribut spécifié et la valeur spécifiée, par exemple, [href="example.com"]signifie tous les href Élément avec la valeur d'attribut "example.com".

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!