我与一个我认识的人进行了长时间的讨论。 他坚持使用iframe将YouTube视频嵌入:
<iframe style=”width: 560px; height: 315px; border: none;” src=”http://www.youtube.com/embed/bla-bla-bla?rel=0″></iframe>
适用于某些视频但不适用于所有视频。
Youtube提供以下嵌入代码:
<iframe src="http://www.youtube.com/embed/bla-bla-bla?rel=0" height="315" width="560" allowfullscreen="" frameborder="0"></iframe>
显然工作正常。
如果需要iframe
和width
,我试图在height
的规范中找到。如果没有提供它们会发生什么。但无法找到相关信息。
有人可以帮助我并解释为什么第一个变体总是不起作用,据我所知,其中一个变体对于第二个变体更好吗?
EDIT1:
所以正确答案如下。我只想评论我是如何得到那些错误的卷曲符号。一个基于WordPress的站点的准则为用户提供了这些代码片段。那个特定的网站(或者它的css;或者一般的wordpress)不区分卷曲和直引号,总是显示卷曲。那么当用户复制粘贴代码时 - 它不起作用。
答案 0 :(得分:2)
根据我们在评论中的讨论,问题是由第一个示例中的引号引起的:
<iframe style=”width: 560px; height: 315px; border: none;”
src=”http://www.youtube.com/embed/bla-bla-bla?rel=0″></iframe>
更改为直引号修复了它:
<iframe style="width: 560px; height: 315px; border: none;"
src="http://www.youtube.com/embed/bla-bla-bla?rel=0"></iframe>
使用W3C Validation Service验证HTML非常有用。这会抓住这个错误和许多其他错误。
答案 1 :(得分:1)
我的猜测是youtube使用window.frameElement
访问height和width属性https://developer.mozilla.org/en-US/docs/Web/API/window.frameElement
他们可能会这样做以调整视频质量等。
如果使用css设置宽度和高度,则不会出现这些内容,并且可能会在代码中遇到错误而不显示视频。
所以答案是,没有那些属性不被要求,但是在这种情况下它们似乎是。
我只能告诉你,如果你有一个例子。