如何在其他元素(如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一样工作)来获得圆角轮廓.

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效