5 Minute Tour of CSS3 Background Gradients: Listing 1.

CSS background

 gradient syntax for different 
 rendering engines. 
.bg
{
  /* fallback color */
  background-color: #000000;

  /* fallback image */
  background: url(http://johnpapa.net/files/downloads/images/bg.png); 
    
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, rgb(0, 0, 0)),
    color-stop(0.46, rgb(11, 111, 211)),
    color-stop(0.46, rgb(0, 0, 0)),
    color-stop(0.50, rgb(0, 0, 0)),
    color-stop(0.50, rgb(11, 111, 211)),
    color-stop(1, rgb(0, 0, 0))
    );
      background: -moz-linear-gradient(
          center bottom,
          rgb(0, 0, 0) 0%,
          rgb(211, 111, 111) 46%,
          rgb(0, 0, 0) 46%,
          rgb(0, 0, 0) 50%,
          rgb(211, 111, 111) 50%,
          rgb(0, 0, 0) 100%
          );
  }

About the Author

John Papa is a Microsoft Regional Director and former Microsoft technical evangelist. Author of 100-plus articles and 10 books, he specializes in professional application development with Windows, HTML5, JavaScript, CSS, Silverlight, Windows Presentation Foundation, C#, .NET and SQL Server. Check out his online training with Pluralsight; find him at johnpapa.net and on Twitter at twitter.com/john_papa.