移动端复选框与单选框颜色不统一？检查 accent-color 属性

确认控件类型与属性应用范围

accent-color 属性目前仅对部分 HTML 元素生效，包括复选框、单选框、滑块和进度条。检查代码中需要应用颜色的元素是否为这些类型，例如 input type='checkbox' 或 input type='radio'。如果元素类型不在支持列表中，设置该属性不会产生任何视觉效果。

确认元素是否正确嵌套在文档流中。该属性作用于用户界面控件，若元素被隐藏或处于不可见状态，颜色设置将无法被用户感知。确保控件在页面中可见且处于激活状态，是验证属性生效的前提条件。同时，注意该属性继承自父元素，若父元素未设置，则默认继承自 body 或 html 根元素。

为控件设置具体的颜色值，例如 accent-color: #5729e9; 或 accent-color: rebeccapurple;。颜色值可以是十六进制、RGB 或 HSL 格式，也可以使用关键字 auto。auto 关键字表示使用浏览器默认的平台强调色，若需统一风格，建议明确指定颜色值。

在移动端浏览器中验证颜色是否正确应用。注意浏览器可能仅在某些状态下应用该颜色，例如复选框的选中状态或单选框的选中状态。检查控件在不同交互状态下的显示效果，确保颜色在所有适用状态下保持一致。若颜色未生效，请检查浏览器兼容性，因为部分旧版浏览器可能不支持此属性。

检查 CSS 样式表中是否存在其他属性覆盖了 accent-color 的设置。例如，某些浏览器可能对控件使用了默认的 border-color 或 background-color，导致自定义颜色被覆盖。确保没有其他样式规则直接修改了控件的视觉表现。

确认父元素是否设置了 accent-color。由于该属性具有继承性，父元素的颜色设置会传递给子元素。若父元素设置了 auto，子元素将使用平台默认颜色。若需统一颜色，建议在 body 或根元素上设置 accent-color，并确保子元素没有显式覆盖该值。

在多种移动端浏览器中测试颜色显示效果。不同浏览器对 accent-color 的支持程度可能不同，某些浏览器可能仅部分支持或显示默认颜色。确保控件颜色在目标浏览器中符合预期，必要时提供降级方案或使用其他样式属性进行兼容。

检查颜色对比度是否符合可访问性要求。自定义颜色应确保控件在背景上清晰可见，避免因颜色过浅或过深导致用户无法识别。使用浏览器提供的颜色对比度工具进行测试，确保控件颜色在所有状态下都具有良好的可读性。若颜色对比度不足，建议调整颜色值或添加背景色以增强对比度。