Intro :

Les sélecteurs désignes un éléments dans le DOM ( document )

Syntaxe :

	element { style proprietes }

Exemple :

    p{
    }
    span{
    }
    section{
    }

On peut déclarer un sélecteurs comme suit :

section {
	color : red;
}

Quand plusieurs sélecteurs ont la même déclaration , ils peuvent être regrouper et séparé par une virgule.

section,span {
	color : red;
}

Le sélecteur peut être un ID , une classe ou une propriété défini dans le HTML :

	<p id="myId" class="myClass"> simplon </p>

implémentation CSS :

 #myId{
	 color : red;
 }
 .myClass{
	 color : red;
 }
 [property]{
	 color : red;
 }

Selecteur par enfant :

Syntaxe :

	selecteur1 > selecteur2 { declarations CSS }

Exemple :

HTML :

	<section>
		<p>
			Text
		</p>
	</section>

CSS :

	section > p 
	{
		color : black;
	}

Cela colorera le texte en noir dans la balise p sans toucher a ce qu’il y a dans la section

Les pseudo-classe :

	button:hover
	{
		color : blue;
	}

Les pseudo-classes permettent de styliser un état spécifiques d’un élément.

Doc avec les pseudo-classe possibles : https://developer.mozilla.org/fr/docs/Web/CSS/Reference/Selectors/Pseudo-classes

Source :

https://developer.mozilla.org/fr/docs/Web/CSS/Guides/Selectors