Nima Zarei
Nima Zarei

Reputation: 1231

Styling a specific sentence in a paragraph with CSS

I want to only target this specific sentence (Starting at $2.00 / frame.) in a paragraph to apply CSS and it has to remain in the same line but when using other elements it skips one line.

<p>Assorted frames made of different material, including MDF, birchwood, and PDE. Select frames can be sanded and painted according to your needs. Starting at $2.00 / frame.</p>

Any help would be appreciated.

Upvotes: 1

Views: 2789

Answers (2)

Kunal Tanwar
Kunal Tanwar

Reputation: 1291

Just wrap your targeted element in span tag and apply style.

p .highlight {
  color: red;
  font-weight: bold;
}
<p>Assorted frames made of different material, including MDF, birchwood, and PDE. Select frames can be sanded and painted according to your needs. Starting at <span class="highlight"> $2.00 / frame. </span> </p>

[Note] Change style according to your need.

Upvotes: 1

Koulinn
Koulinn

Reputation: 21

Perhaps you could put them inside of a span tag because it is an inline element and will not change the behaviour of the whole line. Then you can target the span however you want or putting a class on that span or selecting it as a child from that paragraph.

How it was useful.

<p>Your text here <span class"special-text">Starting at $2.00 / frame.</span> more text </p>

then on CSS

.special-text{
  your styling
}

or

p > .special-text{
  your styling
}

Upvotes: 2

Related Questions