www.webdeveloper.com
Results 1 to 4 of 4

Thread: How would I blend different colors instead of a boring one color heading

  1. #1
    Join Date
    Apr 2012
    Posts
    110

    How would I blend different colors instead of a boring one color heading

    Hi, is it possible to put a heading in with more than one color, like blending a few colors, and also not just a different color for each character, but maybe a few colors like red,yellow,blue going into each character. Just to make text more exciting, than a one color text heading.
    Thanks

  2. #2
    Join Date
    Mar 2012
    Posts
    48
    you can do it with javascript, coloring letter or words, as your wish:
    <script type="text/javascript">
    var message = "The quick brown fox.";
    var colors = new Array("#ff0000","#00ff00","#0000ff"); // red, green, blue
    for (var i = 0; i < message.length; i++)
    document.write("<span style=\"color:" + colors[(i &#37; colors.length)] + ";\">" + message[i] + "</span>");
    </script>


    other than that, in CSS you have an option to choose the first letter or the first line and change its settings:
    element:first-letter {font-size:30px;}
    element:first-line {color:white;}


    Enjoy.
    Last edited by chryaner; 05-06-2012 at 03:55 PM.

  3. #3
    Join Date
    Apr 2012
    Posts
    110

    Where do I put script, under the css style/text, before everything else

    Hi, thanks Chryaner,
    Maybe Ill just learn to try do it in the graphics, but it will obviously be quicker to put it in code. Where do I put the script exactly, in with the css.
    Do I put the <script type="text/javascript"> under <css style/text>

  4. #4
    Join Date
    Mar 2012
    Posts
    48
    you need to put the <script></script> tags between the <head></head> tags of your <html></html> tags on your page

    run a quick search in google and read a basic tutorial about javascript, it will help you

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles