如何删除有针对性的前置边框周围的边框？

Question

当我将pre元素设置为contenteditable并将焦点放入其中进行编辑时,它会在它周围看到一个看起来不太好的虚线边框.当焦点在其他地方时,边界不存在.
如何删除该边框？

谢谢

Answer 1

将outline属性设置为0px solid transparent;.您可能还必须将其设置为:focus状态,例如:

[contenteditable]:focus {
    outline: 0px solid transparent;
}

Answer 2

您还可以将:read-write伪类添加到可编辑的样式元素.

例如(jsFiddle):

.element:read-write:focus {
     outline: none;
}

在这里阅读更多关于codrops的信息.

该:read-write伪类选择器在Chrome,Safari和Opera 14+,而在iOS的支持.它-moz-在表单中支持Firefox中的前缀:-moz-read-write.该:read-write选择器无法在Internet Explorer和Android上的支持.