如何在其他元素(如div或iframe)上模拟活动输入或textarea周围的Chrome/Safari边框?

前端之家收集整理的这篇文章主要介绍了如何在其他元素(如div或iframe)上模拟活动输入或textarea周围的Chrome/Safari边框?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用简单的textarea元素,然后用iframe替换为designMode =’on’,以便用户可以标记一些文本并使其成为斜体.但我仍然希望iframe看起来像textarea,所以我需要一个边框,类似于当textarea处于活动状态时Chrome和Safari中出现的边框.我怎样才能达到这样的效果

解决方法

您可以在webkit中获得如下所示的圆形轮廓:
outline: 2px auto red;

请注意,轮廓的宽度不符合指定的宽度,颜色也不完全准确.

要使用普通焦点颜色,您可以这样做:

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

在moz中,您可以使用-moz-outline-radius(就像border-radius一样工作)来获得圆角轮廓.

猜你在找的CSS相关文章