css - 如何在被前端框架覆盖的属性上强制用户代理（浏览器）默认？

Question

我使用Foundation（没有 SCSS）作为我的 Web 项目的前端框架。在自定义方面，我不喜欢修改我的项目引用的任何第三方模块，而是使用 CSS 的级联顺序规则来覆盖我想要覆盖的框架中定义的任何属性。然而，我在这里有一个棘手的场景。

Foundation 禁用了用户代理的outlinefor text:focusedwith属性text:focused {outline: none !important}。有什么方法可以在不修改框架的 CSS 的情况下强制使用用户代理的outline属性？

score 0 · Accepted Answer

您不能编写另一个 CSS 规则来将元素的样式重置为默认值。在大多数情况下，您可以定义一个新规则来将样式设置回大多数用户代理默认值：

text:focused { outline: solid black 1px; }

不幸的是，您将无法!important使用 CSS 覆盖 Foundation 的声明。但是，您可以使用 JavaScript 来做到这一点；像这样的东西：

document.theText.style.outline = "solid black 1px";

（我没有对此进行测试，但如果您提供您的场景的 JSFiddle 演示，我可以测试。）

1 回答 1