nth-child selector not working(?) in css
<p>So i want to use the nth-child selector to make the first paragraph red. This is my code:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;style&gt; 
p:nth-child(1) {
background: #ff0000;
}
&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;h1&gt;This is a heading&lt;/h1&gt;
&lt;p&gt;I want this paragraph to be red.&lt;/p&gt;
&lt;p&gt;The second paragraph.&lt;/p&gt;
&lt;p&gt;The third paragraph.&lt;/p&gt;
&lt;p&gt;The fourth paragraph.&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>But the result is 0 paragraphs with red color... I dont understand what i am doing wrong.</p>