css - 如何使内容可编辑文本框消失？

我在我的网页上使用 contenteditable。这工作正常，但浏览器在激活时在可编辑部分周围放置了一个丑陋的边框。此外，当焦点更改为页面上的另一个元素时，其中一些边框不会被删除。

Safari 创建浅蓝色边框，Firefox 使用细黑线，因此这里有一些浏览器解释在起作用。

我已经尝试将可编辑部分的边框明确设置为无，并使该 CSS 属性变得重要，但这不会改变浏览器的行为。

我的问题:

当用户在页面元素内部单击以开始编辑时，是否有办法影响页面元素的样式以否决 border 属性？

最佳答案

添加此样式(JsFiddle):

[contenteditable="true"]:active, [contenteditable="true"]:focus
{
   border:none;
   outline:none;
}

让所有 contenteditable 元素在聚焦时不使用边框和轮廓。

编辑:我发现了一个很好的 tutorial

关于css - 如何使内容可编辑文本框消失？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39201433/