How to style diffrent paragraph using multiple styles in internal stylesheet

Answer 1

You can use pseudo-elements in CSS3:

p { background-color: #959595; }

p:nth-child(1) { font-weight: bold; }
p:nth-child(2) { ... }
p:nth-child(3) { ... }

p::after { content: "♡"; }

p::before { content: url(example.jpg); }

p::first-letter { font-size: 36px; }

p::first-line { color: #fff; }

Answer 2

Supposing the following html:

<p id="first-element" class="foo">Bla bla... </p>
<p id="second-element" class="foo">Bla bla... </p>
<p id="third-element" class="foo">Bla bla... </p>

Here are differents solutions to target each paragraphs:

#1----------
p
{
margin: 0;
}

p:nth-child(1)
{
color: red;
}

p:nth-child(2)
{
color: green;
}

#2----------

p
{
margin: 0;
}

#second-element
{
color: red;
}

#third-element
{
color: green;
}

#3----------

p{
margin: 0;
}

.foo:nth-child(1)
{
color: red;
}

.foo:last-child
{
color: green;
}

Answer 3

the use of pseudo elements is nice way but I prefer to use id or class. it's quicker and easier.