IE11边界/轮廓损坏或溢出

Question

textarea {
        outline: none;
    }

<textarea></textarea>

这个问题确实困扰着我，但仍然找不到解决方案，为什么我的textarea坏了，或者显示了黑色或蓝色的轮廓？我在Chrome中没有问题。可以通过单击鼠标将其删除...这就是IE在gif下面的样子：

断线或边框：

Answer 1

这是因为选择/单击文本区域后，文本区域将立即获得focus。您可以通过对border应用常规的textarea:focus设置来防止这种情况，但是不建议这样做，因为突出显示聚焦元素对于一般而言网站的访问至关重要。

（取决于浏览器，您可能还需要添加outline: none和box-shadow: none），因为不同的浏览器对焦点突出显示的处理方式不同。

textarea:focus {
   border: 1px solid black;
}

<textarea></textarea>

Answer 2

也许您可以尝试以下操作，以确保用户无法突出显示文本区域。

textarea {
    outline: 0;
    user-select: none;
    -ms-user-select: none;
}

<textarea></textarea>