在Tumblr代码中使用CSS自动隐藏YouTube播放器控件

Question

我有一个有很多YouTube视频帖子的tumblr。我想知道如何使用CSS来选择{Video-400}邮政编码并隐藏显示在视频上的自动控件。

这是我所指的自动控件/可见标题的示例。一旦你播放视频，它们就会消失：http://jaspingo.tumblr.com/post/105022194129/lol-that-last-one-though。

此外，这里有一些可能有用的CSS选择器（我不知道它们之间的确切差异）。

#content .video{
}
.video{
}
#content .video iframe{
}

以下是相应的HTML。

<div id="content">
<div class="posts">

{block:Posts}

<div class="entry">

{block:Video}
<div class="video">
{Video-400}
</div>
{/block:Video}

</div>
{/block:Posts}
</div>
</div>

任何帮助，将不胜感激。我需要了解CSS选择器之间的区别，以完全理解代码的工作方式。是的，我尝试过来自YouTube的自定义嵌入代码，但存在同样的问题。

Answer 1

我不知道Tumblr是如何进行嵌入的，但你可以在没有控件的情况下从YouTube中获取嵌入代码。典型的嵌入代码如下所示：

<iframe width="560" height="315" src="//www.youtube.com/embed/F8Z-ayQkK2A" frameborder="0" allowfullscreen></iframe>

如果要在事后删除控件，则需要将?controls=0添加到src URL的末尾。它成为了：

<iframe width="560" height="315" src="//www.youtube.com/embed/F8Z-ayQkK2A?controls=0" frameborder="0" allowfullscreen></iframe>

为了演示，here's the same video使用嵌入代码之外的control参数。

您可能遇到的唯一问题是Tumblr使用YouTube API来调用视频而不是嵌入代码。在这种情况下，除非您可以访问源和将视频拉入博客的方法，否则我不确定您能做些什么。