0

我的页面中嵌入了一个 Youtube HTML iframe，代码如下：

<iframe src="http://www.youtube.com/embed/gI2eO_mNM88?rel=0&amp;autohide=1&amp;color=white&amp;showinfo=0&amp;theme=dark&amp;wmode=transparent&amp;hd=1" width="470" height="264" frameborder="0" allowfullscreen webkitAllowFullScreen></iframe>

如果我按下播放键，我会在 IE9+8 中得到一个 1px 的虚线轮廓。我的 CSS 中有这个：

embed,
object {
  outline: 0;
  overflow: hidden
}

但这似乎没有帮助。它在 Chrome 或 FF（均为最新版本）中没有大纲。我还尝试将 iframe 放在与 iframe 尺寸相同的 div 中，并给出该 div 溢出：隐藏，但也没有运气。

4

4 回答 4

1

我为这种情况创建了一个小提琴：http: //jsfiddle.net/keaukraine/UmTZy/

如您所见，轮廓出现在iframe元素内部。您不能影响内部元素的样式，iframe因为它超出了您的网页范围。

一个相当丑陋的解决方案是放置iframe它隐藏 1px 轮廓的方式。我把它放在稍微小一点的 div 里面并定位它，所以它隐藏了这个轮廓。如果这个解决方案适合你，你可以在这个小提琴中看到它：http: //jsfiddle.net/raQEH/

于 2012-08-16T08:13:27.950 回答
0

给你的 iframe 一个 id="iframe" 并试试这个：

#iframe:active, #iframe:focus {
   border: none;
   outline: none;
}
于 2012-08-15T16:58:36.290 回答
0

border:0;如果大纲不起作用，请尝试。

于 2012-08-15T16:58:46.973 回答
0

我刚刚在 youtube 开发论坛上发布了这个问题。希望他们可以从他们的网站解决这个问题

https://groups.google.com/forum/?fromgroups#!topic/youtube-api-gdata/gqt_G5d8HYM%5B1-25%5D

于 2012-08-17T22:03:24.657 回答