CODEWITHSUNDEEP
htmlcss
Mít
Mít

Reputation: 303

Change color for each word in text without js

I want to change the color for some text.

Example:
"hello guys, i am a girl".
1: "hello", "i", "a" is green
2: "guys", "am" and "girl" is grey.

Can I do it?
Please do not use html tag insert to word, something like this :

<p><span class="green">hello</span> <span class="grey">guys</span>, <span class="green">i</span> <span class="grey">am</span> <span class="green">a</span> <span class="grey">girl</span>

I just want <p>hello guys, i am a girl</p> and css for this. Thank you

Upvotes: 0

Views: 183

Answers (2)

AnatPort
AnatPort

Reputation: 748

span:nth-of-type(odd) {
color:green;
}

span:nth-of-type(even) {
color:red;
}

if you don't want it by even/odd words, just change it to a number like this:

 span:nth-of-type(1) {
 color:green;
  }

Upvotes: 1

Shaggy
Shaggy

Reputation: 6796

Without using JavaScript or additional markup, this is not possible with CSS alone.

Upvotes: 1

Related Questions