如何停用Vaadin焦点颜色的全局方法？

该边框是“聚焦环”（它是一种辅助功能，表明该字段已从键盘交互获得焦点，但在使用鼠标聚焦该字段时不会显示）。

对焦环的样式取决于每个组件和主题。

例如，在鲁磨的TextField的聚焦环是CSSbox-shadow的input-field一部分：

:host([focus-ring]) [part="input-field"] {
box-shadow: 0 0 0 2px var(--lumo-primary-color-50pct);
}
:host([invalid][focus-ring]) [part="input-field"] {
box-shadow: 0 0 0 2px var(--lumo-error-color-50pct);
}


找到这些样式的一个方便的方法是检查组件的 shadow DOM 中的标签

您可以覆盖 vaadin-text-field 的焦点环

:host([focus-ring]) [part="input-field"] {
box-shadow: none !important
}


然后，使用with或通过导入样式表。@CssImportthemeFor="vaadin-text-field"registerStyles