小例子:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<style type="text/css">
.linear{
width:50%;
height:30px;
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=#FFFF99,
endColorStr=#6666CC); /*IE*/
background:-moz-linear-gradient(left,#FFFF99,#6666CC);/*火狐*/
background:-webkit-gradient(linear, 0% 0%, 0% 100%,from(#FFFF99), to(#6666CC));/*谷歌*/
}
</style>
</head>
<body>
<div class="linear"></div>
</body>
</html>
注意:
1、IE里面gradientType(等于“1”表示从左到右渐变,等于“0”表示从上到下渐变);
2、background:-moz-linear-gradient(left,#FFFF99,#6666CC); (等于“left”表示从左到右渐变,等于“top”表示从上到下渐变);