Posted 11 years ago
·
Author
This code adds shadows to the text in all of your headers. The default color is white. Replace ffffff with the hex value of the color you want your shadows to be. Here is a hex color calculator to help you out: https://www.imvumafias.org/generators/he ... lator.html
This was tested on Chrome, Firefox, and IE; it worked on all 3. It takes advantage of CSS3 and filters to form cross browser compatibility which otherwise would not be possible for text shadows. You can change the strength and direction numbers to change the size and shape of the shadows. Careful, if you make the shadows too big, then it will just highlight the text instead of adding shadows.
I made this code myself from scratch and it took me a long time to make it work on all major browsers, so have fun.
This was tested on Chrome, Firefox, and IE; it worked on all 3. It takes advantage of CSS3 and filters to form cross browser compatibility which otherwise would not be possible for text shadows. You can change the strength and direction numbers to change the size and shape of the shadows. Careful, if you make the shadows too big, then it will just highlight the text instead of adding shadows.
<style>
.paneltitletext {
/*Chrome Fire Fox Safari text-shadow: right down opacity color*/
text-shadow: 0.1em 0.0em 0.0em #ffffff;
/*IE filter: Shadow(Color=, Direction=, Strength=);*/
filter: Shadow(Color=#ffffff, Direction=135, Strength=5);
}
</style>I made this code myself from scratch and it took me a long time to make it work on all major browsers, so have fun.