Categories
CSS

CSS3: Background gradients

background: #0000FF; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#3399CC’, endColorstr=’#0000FF’); /* for IE */
background: -o-linear-gradient(#333366, #eee 50%, #99CC99);
background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#FFF)); /* for webkit browsers */
background: -webkit-linear-gradient(#333366, #eee 50%, #99CC99);
background: -moz-linear-gradient(top, #333366, #eee 50%, #99CC99); /* for firefox 3.6+ */

height: 100%; /* To ensure the entire page gets covered if you are applying this to the entire body */
margin: 0;
padding: 0;

You can also have only two colors in there, the 50% indicates the position of the third color (in the middle of the screen).