Adding drop shadow to text using CSS?

I’ve found some examples of code that you can add to a site’s CSS that will provide a drop shadow to text. An example is:

h3.a {
 color: white;
 text-shadow: black 0.1em 0.1em 0.2em
}

I would like to make all the text including all heading and navigation have a small drop shadow because the text is white on a coloured background. Does anyone know if there is a simple way to do this or would I have to add specific instructions to add the shadow to each type of text in each section?

Thanks!

Looks like I figured it out! Anyone wanting to add a shadow to text (entire site) just needs to add the following code to the custom CSS tool in the style editor.

body {
 text-shadow: 2px 4px 3px rgba(0,0,0,0.5);
}

(text-shadow: horizontal-offset, vertical-offset, blur, colour)

As per: 12 Fun CSS Text Shadows You Can Copy and Paste

It makes white text on a coloured background easier to read and pop from the page a little.

Cheers!

How about adding the shadow on the page title and description on Parallax images? I know I could add overaly over the pictures and under the text, but I like the site more without the overlay. See examples below: I mean the text TAHDOLLA TEHOKKUUTTA and so on. It would be more visible with a small shadow.

@ja55e

I don't know if you still need this code but I just found this thread - Anyways you have to right-click and inspect your page and highlight the title text in the banner...

Then, copy the YUI code and add it to your css. So it looks like this in your css.

#yui_3_17_2_2_1460472223463_5254  {

text-shadow: 3px 5px 3px 

 rgba(0,0,0,.6);

}

That's it!

Thank you for this code!!!

what if you just want it on the homepage h1 and not ALL h1's?