Friday, May 8, 2009

Gradient Background using CSS without Images

1) The background-color is needed for Firefox as this seems to be unsupported in Firefox.
2) The rest of the code is self explanitory you have the start color and the finish color and the gradientType.
3) When the gradientType is set to 0, it is vertical from top to bottom.
4) When the gradientType is set to 1, it is horizontal from left to bottom.
5) If you are viewing this site within Internet Explorer or an IE based browser, the title bar has its
own gradient.
CSS:
body{background-color:#F8F8F8;filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFCCFF' ,endColorStr='#8fffff' ,gradientType= '0' );width:400px;} body{background-color:#F8F8F8;filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFCCFF' ,endColorStr='#8fffff' ,gradientType= '1' );width:400px;}
HTML:
<div>
This is the test message to understand how to get Gradient BackGround in IE using CSS without any need of Images.
</div>


1 comment:

electronic signature software said...

Very helpful article ! I was always curious about all these complex algorithms that are being used in these ssl encryptions.