在summernote焦点状态设置边界颜色

Question

我想将summernote div的边框颜色设置为焦点上的浅蓝色，并在焦点上将其设置为中性。

我设法通过使用以下方法删除div周围的阴影：

div.note-editor.panel.panel-default {
    box-shadow: none;
}

我遇到的问题是我没有找到在聚焦时调整其状态的方法。使用.focused或：focus也没有帮助。

Answer 1

根据MDN文档，:focus表示已获得关注的元素（例如表单输入）。另一方面，:activere表示由用户激活的元素（例如按钮）。在你的情况下，它将是:active而不是:focus。

div.note-editor.panel.panel-default {
  box-shadow: none;
  cursor: pointer;
}

div.note-editor.panel.panel-default:active {
 outline: 1px solid blue;
}

<div class="note-editor panel panel-default">
  Hello Focus
</div>