changing the color of a part of text in stylus css?

Question

i want to change the color of only one word in string of text using stylus i.e.

#copy
   h1 Our new site will be ready soon..

the stylus code is

  h1
   font-weight bold
   color white

i just want to change the color of the first letter in the h1 phrase "Our" into yellow how could i achieve that in stylus, thanks :)

Lieutenancy

Answer 1

You can try the :first-letter selector:

h1:first-letter
    color: yellow

Here's a fiddle with an example.

Lengthy

Answer 2

The css selector "first-letter" selector is a good option.

If you want to change other letters or parts of text as per your example, use a span with its own style, e.g.

<h1><span style="color:yellow">O</span>ur <span style="color:blue">new</span> website</h1>

Champagne

Answer 3

This could be done by making use of Pseudo-elements

Fiddle

Arteaga