如题，自己在使用picker-view组件时，想把picker-view的背景色改成另一个颜色，以符合视觉稿。通过一番摸索后发现，picker-view背景显示白色的原因是因为其上方的遮罩层设置了带透明度的白色，故自己想从设置mask的背景色来解决这个问题。但是当设置了mask的渐变背景后，发现渐变只覆盖了mask的上半部分。
- 请问如何设置能使渐变色覆盖mask的全部呢？。通过自己的观察发现，picker-view组件 中mask的默认背景渐变样式是从顶端开始到选中框上方，不透明度逐渐降低，而后选中框上方完全透明，再从选中框下方开始直到末尾不透明度逐渐增加，呈现一种以选中框为轴两端对称的渐变效果，请问是否有便捷方法能设置mask的样式以模仿这种效果，只是背景色稍加变换？
研究和测试后，我这样写实现对称的渐变样式
样式名：indicator-class="indicator"
样式内容：
.indicator { position: relative; } .indicator::after { position: absolute; content: ''; width: 100%; height: 1px; border-color: rgba(255, 255, 255, 0.3); background: none; } .indicator::before { position: absolute; content: ''; width: 100%; height: 1px; border-color: rgba(255, 255, 255, 0.3); background: none; }------
样式名：mask-class="mask"
样式内容：
.mask { background: none; } .mask::after { position: absolute; content: ''; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(50, 46, 131, 0.98) 0%, rgba(50, 46, 131, 0.1) 49%, rgba(50, 46, 131, 0) 50%, rgba(50, 46, 131, 0.1) 51%, rgba(50, 46, 131, 0.98) 100%) no-repeat; }首先谢谢分享，我的需求是深色模式下 pick-view 的样式要和浅色模式下的样式一样，试了很多，都不行，终于翻到你的文章了，不错，我试着改了下，如下：
.mask::after { position: absolute; content: ''; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 1) 100%) no-repeat; }最后实现了这个效果，但是有个地方很疑惑：opacity 指定不透明度。从0.0（完全透明）到1.0（完全不透明） RGBA(255,255,255,1)代表完全不透明，RGBA(255,255,255,0.5)代表半透明。
这就很操蛋了，上述代码必须是 1 不透明才能实现半透明效果