iframe - 如何在其他元素(例如 div 或 iframe)上模拟事件输入或文本区域周围的 Chrome/Safari 边框？

Question

我使用的是简单的 textarea 元素，然后用带有 designMode='on' 的 iframe 替换它，让用户可以标记一些文本并将其设为斜体。但我仍然希望 iframe 看起来像 textarea，所以我需要一个边框，类似于 textarea 处于事件状态时出现在 Chrome 和 Safari 中的边框。我怎样才能达到这样的效果？

Answer 1

您可以像这样在 webkit 中获得圆角轮廓:

outline: 2px auto red;

请注意，轮廓的宽度不会遵循指定的宽度，并且颜色也不完全准确。

要使用正常的焦点颜色，您可以这样做:

outline: 2px auto -webkit-focus-ring-color;

在 moz 中，您可以使用 -moz-outline-radius ( 就像 border-radius 一样) 以获得圆角轮廓。