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端要写四段,才能实现这样一个渐变效果。
以下是期望效果

相关推荐
右耳朵猫AI12 小时前
Web前端周刊2026W36 | pnpm 12 Rust 重写、Remix 3 RC、Node.js 26.8.0、htmx 4.0 大版本
前端·rust·node.js
平头哥~13 小时前
Day 21 | animation 与 keyframes:把动画从 A 到 B 变成多点编排
前端·css·css3·css学习
宿6741 天前
vue3-包管理器
前端·vue.js
@PHARAOH1 天前
WHAT - Remix 入门和基本实践:理解两套产物
前端·remix
mayaairi1 天前
Vue2 生命周期完全指南:从创建到销毁的8个钩子函数
前端·javascript·vue.js
xy34531 天前
axure9.0 如何打造一个计时器(简单版)
前端·ui·html·axure·原型·产品设计
IMPYLH1 天前
HTML 的 <pre> 元素
前端·javascript·html
tsumikistep1 天前
【前端】Vue + Axios 跨域问题实战:7070 代理转发 8080 + 401 报错分析(黑马外卖)
前端·javascript·vue.js
lichenyang4531 天前
鸿蒙首页从等高商品 Grid 到双列瀑布流:同一张图也能做出小红书式浏览节奏
前端
里欧跑得慢1 天前
Flutter主题与样式详解
前端·css·flutter·web