Posted By

apphp-snippets on 03/06/13

Tagged

Versions (?)

Last Edited at 03/06/13 10:28pm

Statistics

Viewed 954 times

Favorited by 1 user(s)

Related snippets

Adding Background Gradient in CSS

/ Published in: CSS

Today with CSS3, you no longer need a background image for gradients. You can use CSS to add a gradient to the background of some elements on your page. For ex.: change the color hex values ("84c8d7" and "327fbd") to the gradient color you need.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

<style>
.grad{
  background: -webkit-gradient(linear, left top, left bottom, from(#84c8d7), to(#327fbd));
  background: -moz-linear-gradient(top,  #84c8d7,  #327fbd);
  filter:
    progid:DXImageTransform.Microsoft.gradient(startColorstr="#84c8d7", endColorstr="#327fbd"); 
}
</style>
 
<div class="grad">This is a DIV with gradient background.</div>