CSS Blur Effect

Code:
<style type=”text/css”>
   .blur {
   color: transparent;
   text-shadow: 0 0 5px rgba(0,0,0,0.7);
   font-size: 40px;
   font-weight:bold;
   font-family:Arial, Helvetica, sans-serif;
   }
</style>

<div class=”blur”>CSS BLUR EFFECT</div>

 

CSS3: Some Attractive Effects

CSS3 is the latest edition of the CSS Stylesheets. There are several new functionalities have been provided through CSS3. Functions such like Text-shadow, box-sizing, opacity, multiple backgrounds, Gradient Fill, border-radius and box shadows are some of the much attractive introductions.

Here Some Examples:

Text Shadow

 

CSS3 Hover Image Gallery

A sleek image gallery that takes advantage of CSS3 animation, shadows, and the “transform” property to instantly add a smooth hover effect to its images, whereby the image enlarges and moves closer to the user.

The hover effect currently works best in Google Chrome, Safari 4+, and Opera 9.5+. In FF 3.6, the CSS animation is skipped, while in IE, the entire effect isn’t visible.
DEMO
CSS Code