color属性是跨平台唯一可靠方式，因uni-radio在小程序编译为原生radio标签DOM不可访问，H5下appearance:none兼容性差且uni-ui已移除穿透类名，而color被各端官方支持并映射为对应属性。
直接用 color 属性最稳，别碰 css 覆盖 —— 这是跨平台唯一可靠方式。
为什么 color 是首选，而不是写 CSS
uni-app 的 uni-radio 在小程序平台编译为原生 <radio></radio> 标签，DOM 结构不可访问；H5 下虽生成 <input type="radio">，但浏览器限制 appearance: none 兼容性差，且新版 uni-ui 已移除 .uni-radio__icon 等可穿透类名。你写的 .uni-radio-input-checked { background: red } 在微信、支付宝、字节等平台大概率不生效。
而 color 属性是 uni-app 官方明确支持的跨平台控制项：
- 微信小程序下映射为
activeColor，直接作用于原生组件 - H5 下通过伪元素模拟选中态，
color会驱动对勾/圆点颜色 - 支付宝、字节、百度等平台均识别该 prop，行为一致
示例：<uni-radio v-model="val" color="#ff4757"></uni-radio>
::v-deep 强行覆盖只在特定场景能用
如果你必须改未选中边框色、选中背景色、或隐藏默认图标（比如想换 SVG），::v-deep 是最后手段，但有严重限制：
- 仅对 H5 和微信小程序有效；支付宝、字节等平台无
.wx-radio-input类名，选择器直接失效 - 必须写在全局样式（如
App.vue）或带scoped的页面里加::v-deep，单文件组件内局部写无效 - 需配合
!important，且选择器层级要严格匹配编译后结构，例如：::v-deep .custom-radio .wx-radio-input.wx-radio-input-checked - 未选中态边框色需单独设：
::v-deep .custom-radio .wx-radio-input { border-color: #999 !important; }
注意：.wx-radio-input 是微信小程序编译产物，其他平台对应类名不同（如支付宝是 ali-radio-input），无法一套代码通吃。
大小和形状根本没法靠 CSS 改
原生 radio 组件不支持设置宽高、border-radius、背景图等 —— 这不是 uni-app 的锅，是各端平台限制：
- 微信小程序
<radio></radio>不暴露内部节点，CSS 无法触及 - H5 的
<input type="radio">默认不可设width/height，transform: scale()只能粗略缩放，但会连带文字一起缩，布局易错位 - 想圆角、SVG 图标、禁用态阴影？只能放弃
uni-radio，手写<view></view>+@click+v-model模拟
强行用 transform: scale(0.7) 改大小，只建议用于 H5 临时调试，上线前务必在真机测多端表现。
真要完全自定义？别封装，直接重写
当设计要求超出 color 能力（比如：选中时显示红色圆圈+白色对勾、禁用态变灰透明、点击有缩放动画），就别折腾覆盖样式了：
- 用
<view class="custom-radio"></view>替代<uni-radio></uni-radio> - 内部用
<view class="radio-icon"></view>承载自定义 SVG 或字体图标 - 用
v-bind:class控制选中/禁用态 class，再配 CSS 动画 - 通过
@click触发v-model更新，逻辑保持一致
这种方案兼容性 100%，但代价是失去原生组件的无障碍支持和平台一致性交互反馈 —— 需手动补全 aria-checked、键盘空格切换等细节。
最容易被忽略的一点：所有 CSS 覆盖方案，在字节跳动小程序、快应用、华为快服务等非微信生态平台基本失效；color 属性是目前唯一能守住底线的方式。如果项目要上多端，别在样式覆盖上投入过多时间。
