How to target specific text content in a paragraph which contains multiple line breaks?

Question

So here is the weird thing I am clueless on..

Below is the sample snippet of the HTML,

<p>This is a paragraph with <br><br> two weird line breaks <br><br> and that too TWICE!</p>

Now the issue is, I want to apply CSS to the text This is paragraph OR the content after first-double line breaks.

I tried br + br or nth-selectors, all css selectors I could think of, but it didn't worked out.

Tricky part is, I do not want to do by javascript, or else I would have done it easily accompanied by 'complexity'.

Any hints or solution to this problem by CSS ONLY!!

Thanks!

Answer 1

You could do this by adding in HTML. I dont think there is a CSS specific way to do this.

<p><span id="snippet">This is a paragraph with </span><br><br> two weird line breaks <br><br> and that too TWICE!</p>

Then apply your CSS like this

#snippet{
//css styles go here
}