advanced code snippet search

Posted By

apphp-snippets on 03/06/13


Tagged

css background gradient


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

Abiotic


Adding Background Gradient in CSS

 / Published in: CSS
 

URL: http://www.apphp.com/index.php?snippet=css-background-gradient

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 
  1. <style>
  2. .grad{
  3.   background: -webkit-gradient(linear, left top, left bottom, from(#84c8d7), to(#327fbd));
  4.   background: -moz-linear-gradient(top,  #84c8d7,  #327fbd);
  5.   filter:
  6.     progid:DXImageTransform.Microsoft.gradient(startColorstr="#84c8d7", endColorstr="#327fbd"); 
  7. }
  8. </style>
  9.  
  10. <div class="grad">This is a DIV with gradient background.</div>

Report this snippet  

You need to login to post a comment.