Borders and backgrounds with CSS3 - HTML5 and CSS3 - page 380

A simple gradient is easy—specify the direction
and two colors. The browser calculates a gradient
across the entire background, treating the first
color as the starting color and the second as the
end color:
background: linear-gradient(
to bottom, #000, #fff
);
In addition to up and down, gradients can go
from one side to another:
background: linear-gradient(
to right, #000, #fff
);
Maybe you want something other than up and
down or left and right. You can combine the two
to get diagonal gradients:
background: linear-gradient(
to bottom left, #000, #fff
);
The direction can also be specified in degrees.
The above rule is equivalent to this:
background: linear-gradient(
315deg, #000, #fff
);
If you add more colors, the browser treats them
as equally spaced color stops and calculates the
gradient accordingly:
background: linear-gradient(
to bottom, #000, #fff, #000, #fff
);