Was ist der cssnot-Selektor? Detaillierte Erklärung des not()-Selektors-CSS-Tutorial-php.cn

Was ist der cssnot-Selektor? Detaillierte Erklärung des not()-Selektors

云罗郡主

Freigeben： 2018-11-19 10:27:41

Original

5506 Leute haben es durchsucht

Der Inhalt dieses Artikels befasst sich mit dem CSS-Selektor. Ich hoffe, er wird Ihnen als Referenz dienen.

not()-Selektor

In CSS3 wird der :not()-Selektor hauptsächlich verwendet, um alle Elemente außer einem bestimmten Element auszuwählen. Dies ist ein sehr nützlicher Selektor.

Beispiel:

<html xmlns="http://www.w3.org/1999/xhtml">
<head> 
<title>CSS3 :not()选择器</title>
    <style type="text/css">
        *{padding:0;margin:0;}
        ul{list-style-type:none;}
        ul li:not(.first)
        {
            color:red;
        }
    </style>
</head>
<body>
    <ul>
        <li class="first">php中文网</li>
        <li>php中文网</li>
        <li>php中文网</li>
        <li>php中文网</li>
    </ul>
</body>
</html>

Nach dem Login kopieren

Der Effekt ist wie folgt:

Was ist der cssnot-Selektor? Detaillierte Erklärung des not()-Selektors

Analyse:

Für „ul li:not (.first )“ betrachten wir diesen Selektor in zwei Schritten. Das „. first“ in den Klammern bedeutet, dass das Element mit dem Klassenwert first (d. h. das erste li-Element) ausgewählt wird, also „ul li:not ( .first)“ bedeutet, dass alle li-Elemente unter dem ul-Element ausgewählt werden, mit Ausnahme des ersten li-Elements.

Wenn es keinen :not()-Selektor gibt, wäre es für uns mit viel redundantem Code sehr mühsam, den oben genannten Effekt zu erzielen. Tatsächlich: Die Idee, den Not()-Selektor zu verwenden, ähnelt der Idee der Komplementmenge in der Mathematik. Der :not()-Selektor ist in der tatsächlichen Entwicklung sehr praktisch und flexibel.

Das Obige ist eine vollständige Einführung in den CSS3-Selektor. Die ausführliche Erklärung des not()-Selektors. Wenn Sie mehr über das CSS3-Tutorial erfahren möchten, lesen Sie bitte die chinesische PHP-Website.

Das obige ist der detaillierte Inhalt vonWas ist der cssnot-Selektor? Detaillierte Erklärung des not()-Selektors. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!