Que fait le symbole \'\' dans les sélecteurs de frères et sœurs CSS ?-tutoriel CSS-php.cn

Que fait le symbole \'\' dans les sélecteurs de frères et sœurs CSS ?

Barbara Streisand

Libérer： 2024-10-28 21:33:30

original

874 Les gens l'ont consulté

What does the ' ' symbol do in CSS sibling selectors?

La signification de ' ' dans les sélecteurs de frères et sœurs CSS

En CSS, le symbole ' ' représente le combinateur frère adjacent. Il sélectionne un élément qui apparaît immédiatement après un autre élément spécifique. Ce sélecteur est utile pour cibler des éléments spécifiques dans un ordre spécifique.

Exemple :

Considérez la règle CSS suivante :

h2 + p { 
  font-size: 1.4em; 
  font-weight: bold;
  color: #777; 
}

Copier après la connexion

La règle applique les styles spécifiés à n'importe quel

élément qui suit directement un élément

élément. Cela n'affecterait pas

les éléments qui apparaissent après tout autre élément, tels que

ou tags.

Illustration :

<code class="html"><h2>Headline!</h2>
<p>The first paragraph.</p>  <!-- Selected -->
<p>The second paragraph.</p> <!-- Not selected -->

<h2>Another headline!</h2>
<blockquote/>
    <p>A quotation.</p>      <!-- Not selected -->
</blockquote/></code>

Copier après la connexion

Sélectionné (1) : Le premier
l'élément vient immédiatement après un
élément.
Non sélectionné (2) : Le deuxième
ne suit pas directement un élément
élément; au lieu de cela, il suit un
élément.
Non sélectionné (3) : L'élément
L'élément dans le blockquote n'a pas d'élément
élément qui le précède immédiatement.

Remarque :

Le combinateur frère adjacent est distinct du combinateur frère général '~', qui sélectionne les éléments qui suivent un autre élément n'importe où chez le même parent.

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!