h5 IOS端渐变的兼容问题 渐变实现弧形效果

IOS端使用渐变的时候有兼容问题

以下是问题效果,图中黑色部分期望的效果应该是白色的。但是ios端是下面的样子......


安卓+pc 支持

css 复制代码
background-image: radial-gradient(circle 40rpx at 100% 0, #f3630c 40rpx, rgb(255, 255, 255) 50%);

安卓+pc + ios支持

css 复制代码
background-image: radial-gradient(circle 40rpx at 100% 0, #f3630c 40rpx, rgb(255, 255, 255) 98%, #fff);

下面的写法兼容全部平台推荐使用。

注释:rpx是uniapp的原因。各位自行调整px等。

不同点就是ios端要写四段,才能实现这样一个渐变效果。
以下是期望效果

相关推荐
Hopebearer_1 小时前
Vue3生命周期以及与Vue2的区别
前端·javascript·vue.js·前端框架·vue3
雅望天堂i1 小时前
vue的diff算法
前端·javascript·vue.js
Joker Zxc1 小时前
【前端基础】2、HTML的元素(基础说明)
前端·html
予安灵3 小时前
《白帽子讲 Web 安全:点击劫持》
前端·网络·安全·web安全·网络攻击模型·安全威胁分析·点击劫持
Enti7c4 小时前
什么是 jQuery
前端·javascript·jquery
taopi20245 小时前
若依vue plus环境搭建
前端·javascript·vue.js
十八朵郁金香6 小时前
深入浅出理解编译器:前端视角
开发语言·前端·javascript
huangkaihao6 小时前
解锁Vue超能力:深度解析Render函数与高效渲染的奥秘
前端·vue.js·前端框架
dawnkylin6 小时前
CSS 浮动布局
css·float·布局·浮动
桂月二二6 小时前
Island架构与部分水合技术解析:下一代Web应用的性能突围
前端·架构