: erste Selektor funktioniert nicht in CSS

Question

Ich erwartete die Verwendung von: ersten Selektor durch das folgende Beispiel demonstriert werden. Ach! Absatz wird nicht rot mit Hintergrund. Kann jemand helfen?

p:first{background:red;}

<p>This is paragraph 1.</p> 
 

 
<p>This is paragraph 2.</p> 
 

 
<p>This is paragraph 3.</p>

Referenzen: https://developer.mozilla.org/en/docs/Web/CSS/:first

HINWEIS: Die Frage für diese Demonstration insbesondere Selektor ist. Also, bitte bleiben Sie dabei!

Answer 1

Von der Referenz Sie verknüpft:

The: erste @page CSS Pseudo-Klasse beschreibt das Styling der ersten Seite wenn Drucken eines Dokuments.

Der erste Absatz ist ein Absatz, keine Seite. Sie rendern das Dokument auf dem Bildschirm und drucken es nicht auf Papier.

Betrachten Sie stattdessen :first-child.

Answer 2

Sie benötigen Kind hinzuzufügen:

p: first-child {background: red;}

p:first-child{background:red;}

<p>This is paragraph 1.</p> 
 

 
<p>This is paragraph 2.</p> 
 

 
<p>This is paragraph 3.</p>

Answer 3

jQuery einen Selektor hat genannt: Erstens, aber es ist nicht mit CSS verwandt: erster Selektor.

$("p:first").css ("background", "red");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p>This is paragraph 1.</p> 
 

 
<p>This is paragraph 2.</p> 
 

 
<p>This is paragraph 3.</p>