Design the gradient background is that choose a small strip of gradient image and repeat to x coordinate or y coordinate. That one simplest way for gradient but you do not want then there many different code for different browser but there is very big problem all the browser are not support that code .Firefox 2/3+ and Opera 9.64 (at least). Safari and Chrome have native support for CSS Gradients but IE do not support the css gradient code. IE run with there own principle but they slowly but at last shift towards the running world.

IE supported/ inbuilt code but it doesn’t support  by other browser.

filter:progid:DXImageTransform.Microsoft.gradient(startColorstr = #44440000, endColorstr = #CCFFFFFF);

For Safari

WebKit now supports gradients specified in CSS. There are two types of gradients: linear gradients and radial gradients.

-webkit-gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]? [, <stop>]*)

]*)

background: -webkit-gradient(linear, left top, left bottom,
from(#00ddeb), to(#fff), color-stop(0.5, #fff),
color-stop(0.5, #66ff00));

You can use gradients in the following places:

background-image
border-image
list-style-image
content property

note that you will need to specify two separate background CSS properties, one with

-webkit-gradient and another with -moz-linear/radial-gradient which has a different syntax).

For Mozilla Firefox

supports two types of gradients: linear ( -moz-linear-gradient) and radial ( -moz-radial-gradient).

Syntax -moz-repeating-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* ) Where: <stop> <color> [ <percentage> |  <length> ] Values <point> A position, interpreted in the same way as background-position or -moz-transform-origin. This is used to define the starting point of the gradient. <angle> An angle of direction for the gradient. See <angle>. <stop>

Example…

background-image: -moz-linear-gradient(left, right,
from(red),
color-stop(16%, orange),
color-stop(32%, yellow),
color-stop(48%, green),
color-stop(60%, blue),
color-stop(76%, indigo),
to(violet));

even though currently it is only supported in the Firefox alpha, Safari 4, and Chrome 3 browsers.

Supported by all Browser

just include css-gradients-via-canvas.js (12KB) anywhere on the page .