CSS3 线型渐变
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Linear</title> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <style> div { width: 400px; height: 100px; background-color: #0a0; border-radius: 5px; background-image: -webkit-linear-gradient(#0c0, #0a0); background-image: -moz-linear-gradient(#0c0, #0a0); background-image: -ms-linear-gradient(#0c0, #0a0); background-image: -o-linear-gradient(#0c0, #0a0); background-image: linear-gradient(#0c0, #0a0); } </style> </head> <body> <div></div> </body> </html>