1、使用CSS3的线性渐变（ps:这种一般不大推荐，其对于手机端浏览器的兼容性不高），但用在小程序还是可以的。 height: 1px; width:100%; background: -webkit-linear-gradient(red, blue); /* Safari 5.1 - 6.0 / background: -o-linear-gradient(red, blue); / Opera 11.1 -12.0*/ background: -moz-linear-gradient(red, blue); /* Firefox 3.6 - 15 / background: linear-gradient(red, blue); / 标准的语法（必须放在最后）/ 上面的： background: -webkit-linear-gradient(red, blue); / Safari 5.1 - 6.0 / background: -o-linear-gradient(red, blue); / Opera 11.1 -12.0*/ background: -moz-linear-gradient(red, blue); /* Firefox 3.6 - 15 */ 主要是为了兼容手机浏览器 这种是从上往下的线性渐变。其他的，例如从左往右要写成linear-gradient(left,red, blue) 2、下面这种就是比较推荐的。weui的实现方式 height: 1px; width:100%; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scaleY(0.5); transform: scaleY(0.5); 其他可参考：blog.csdn.net/tyro_java/a… www.runoob.com/css3/css3-g… www.zhangxinxu.com/wordpress/2…
