web-kit-anylink用户代理样式中下划线元素不显示text-decoration问题

• 首先校验元素类型：确认你编写的Home、Bane等导航元素是否为<a>标签，只有超链接标签才会触发浏览器默认的-webkit-any-link用户代理样式。如果你用了<div>、<span>等其他标签模拟导航，默认不会加载该规则，此时的下划线大概率来自自定义全局样式或者属性继承。
• 调整开发者工具显示配置：打开Elements面板的Styles栏，点击右上角的设置齿轮图标，确认Show user agent styles选项处于勾选状态。未勾选该选项时用户代理样式会被全局隐藏，只会展示自定义样式和继承自body的样式。
• 无需等待规则显示即可直接修改样式：如果你的核心需求是修改下划线效果，不需要等待用户代理规则在Styles栏显示，直接给对应元素写自定义样式覆盖默认规则即可：

/* 全局覆盖所有a标签的默认下划线样式 */
a {
  text-decoration: none; /* 移除默认下划线 */
  /* 如需保留下划线可修改为其他样式，示例如下 */
  /* text-decoration: underline wavy #2563eb;
  text-underline-offset: 6px; */
}

如果自定义样式不生效，可以临时加!important测试，排查是否为选择器优先级不足的问题。

内容的提问来源于stack exchange，提问作者nguyencuc2186