angular - 如何更改 Ngb-Datepicker 导航箭头中的边框

Question

嗨，我想消除单击按钮后显示的蓝色边框，我已经尝试使用

::ng-deep{
  .ngb-dp-arrow > button:active {
   border: none !important;
}

但似乎没有任何效果，我已经用这种方法改变了雪佛龙的颜色，所以我将我的 css 放在正确的位置（组件本身）

复制链接：https ://stackblitz.com/edit/angular-er2bdu?file=src%2Fapp%2Fdatepicker-popup.css

Answer 1

您应该能够使用以下 CSS 删除边框：

::ng-deep .ngb-dp-arrow-btn:focus {
  outline: 0 !important; // remove the darker blue border
  box-shadow: none !important; // remove the light blue border
}

:focus伪选择器出现了 2 个边框：

• 深蓝色边框 - 可以通过设置outline为0
• 浅蓝色框边框 - 可以通过设置box-shadow删除none

请参阅此 Stackblitz以获取工作演示。