我发现了一些有助于视频嵌入响应的代码：http://alxmedia.se/code/2013/10/make-wordpress-default-video-embeds-responsive/
问题不在于代码，代码工作得很好！您可以在以下位置看到一个实例：http://joshrodg.com/hall/ - 这正处于开发阶段，只需向下滚动并查看视频：-）
我想做的是max-width. 当我设置max-width 在当前div, 视频被切断，顶部和底部都有黑色条。如果有办法max-width 同时保持纵横比。视频太大了，无法保持100%的宽度。。。我的想法更像600px，但仍然可以在更小的屏幕上缩放，以便一切都保持响应。
我当前使用的代码已经从原始源代码中稍微调整了一下，所以我将继续在这里发布它。。。
功能：
function video_embed( $html ) {
return \'<div class="video-wrap">\' . $html . \'</div>\';
}
add_filter( \'embed_oembed_html\', \'video_embed\', 10, 3 );
CSS：
.video-wrap {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.video-wrap iframe,
.video-wrap object,
.video-wrap embed,
.video-wrap video {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
生成的输出：
<div class="video-wrap">
<iframe width="500" height="281" src="https://www.youtube.com/embed/hevFL7CiUx4?feature=oembed" frameborder="0" allowfullscreen=""></iframe>
</div>
最合适的回答,由SO网友:Josh Rodgers 整理而成
所以，很明显，在我发布我的问题之前，我需要多读一点。
发布问题后，我突然发现：https://moodle.org/mod/forum/discuss.php?d=258650, 这就是我在使用的代码中加入的内容。
我将函数修改为如下所示：
function video_embed( $html ) {
return \'<div class="video-container"><div class="video-wrap">\' . $html . \'</div></div>\';
}
add_filter( \'embed_oembed_html\', \'video_embed\', 10, 3 );
我添加了以下css：
.video-container {
max-width: 400px;
}
所以，我所做的是添加一个
video-container 缠绕在我周围的div
video-wrap div，其中我指定了
max-width.
我尝试了所有不同的宽度，所有这些现在都起作用了：-）
