Share this page 

Do simple CSS effectsTag(s): HTML/CSS


While this HowTo has nothing to do with Javascript, it's cool so here it is ...

  • Colored Link effect (on a page)
    <HTML><HEAD>
    <STYLE type="text/css">
      <!--
      A:hover {color:red}
      -->
    </STYLE>
    </HEAD><BODY>
    <A HREF="">Move over me</A>
    </BODY></HTML>
    
    You can try it here.

  • Colored effect
    <span onmouseover="style.color='ff0000';"
    onmouseout="style.color='00ff00';">Move over me</span>
    
    You can try it : Move over me

  • Link with no underline
    <a href="../howto.html" style="text-decoration: none">link</a>
    
    You can try it here .

  • Glow effect (IE only)
    <span style="position:relative; width:190; height:10;
    filter:glow(Color=#009966,Strength=1)"> Glow effect ! </span>
    
    It looks like his : Glow effect !

  • Highlighted text
    <SPAN STYLE="background-color:orange">i'm highlighted!</SPAN>
    
    Here how it looks