Comment est le « supérieur à » ou « > « caractère utilisé dans CSS ?

Question

J’ai vu cela à plusieurs reprises dans les fichiers CSS de caractère mais je n’ai aucune idée comment son utilisé. Peut quelqu'un me l’expliquer et montrer comment elles sont utiles en facilitant un style de page ?

Answer 1

C'est un CSS sélecteur d'enfant. P > SPAN moyen en appliquant le style qui suit pour toutes les balises SPAN, qui sont des enfants d'un P balise.

Notez que le terme "enfant" signifie "descendant", pas n'importe quel descendant. P SPAN est un sélecteur de descendant, en appliquant le style qui suit à tous SPAN balises qui sont les enfants d'un P balise ou de manière récursive les enfants de toute autre balise qui est un enfant ou un descendant d'un P balise. P > SPAN s'applique uniquement à l' SPAN balises qui sont les enfants d'un P balise.

Answer 2

<pre><code></code><p><code></code><code></code><code></code>s:</p><pre><code></code></pre><p>D'un autre côté</p><pre><code></code></pre><p><code></code><code></code>. Donc il correspondra : </p><pre><code></code></pre><p>Mais pas :</p><pre><code></code></pre></pre>

Answer 3

ceci est connu comme un Enfant Combinator:

Un enfant combinator sélecteur a été ajouté pour être en mesure de style, le contenu de les éléments contenus dans d'autres éléments spécifiés. Par exemple, supposons que l'on veut définir le blanc la couleur des liens hypertexte à l'intérieur de balises div pour une certaine classe parce qu'ils ont un arrière-plan sombre. Cela peut être accompli en utilisant une période de combiner div avec la classe de ressources et un signe supérieur à un combinateur de combiner la paire avec une, comme indiqué ci-dessous:

div.resources > a{color: white;}

(à partir de http://www.xml.com/pub/a/2003/06/18/css3-selectors.html)

Answer 4

<blockquote> <pre><code></code></pre> <p>Correspond à tout élément F qui est un enfant d’un élément E.</p> <p>plus sur <a href="http://www.w3.org/TR/CSS21/selector.html#child-selectors" rel="nofollow">http://www.w3.org/TR/CSS21/selector.html#child-selectors</a></p></blockquote>