实现效果：
代码段：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>条纹背景</title>、 <style> div{ height: 200px; width: 500px; background:linear-gradient(#fb3,#58a); } </style> </head> <body> <div> </div> </body> </html>效果展示：
代码段：
background:linear-gradient(#fb3 20%,#58a 80%); background:linear-gradient(#fb3 40%,#58a 60%); background:linear-gradient(#fb3 50%,#58a 50%);效果展示：
代码段：
div{ height: 200px; width: 500px; background:linear-gradient(#fb3 50%,#58a 50%); background-size: 100% 30px; }效果展示：
代码段：
background:linear-gradient(#fb3 30%,#58a 30%); background-size: 100% 30px;如果一个色标的位置值小于整个列表中以前的色标的位置值，则该色标的位置值将设置为其前面偶尔的色标位置值的最大值
效果展示：
代码段：
background:linear-gradient(#fb3 30%,#58a 0); background-size: 100% 30px;代码段 ：
background:linear-gradient(#fb3 33.3%,#58a 0,#58a 66.6%,green 0); background-size: 100% 30px;