Wordpress在以正确的纵横比嵌入视频方面做得很好。嵌入式视频的宽度基于content width 设置主题的功能。php文件。因此，听起来似乎有一些样式应用于主题中的iframe元素，以改变其大小。

为了确保您的视频在响应性布局中以任意宽度工作，而不会在视频周围形成难看的黑色边框，您需要采取一些额外的步骤。

首先，您需要将嵌入的视频包装在一个div中，以便我们可以对其应用一些样式。将以下内容添加到函数中。php文件。

function mythemename_wrap_embeds( $html, $url, $attr, $post_id ) {
    return \'<div class="video">\' . $html . \'</div>\';
}
add_filter( \'embed_oembed_html\', \'mythemename_wrap_embeds\', 10, 4 );

接下来，我们将添加一些样式来设置intrinsic ratio 确保视频的高度在宽度变化时按比例缩放。

.video {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.video:before {
    content: "";
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    display: block;
    overflow: hidden;
}

.video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

的。视频：在元素使用填充设置其相对于其父元素的高度之前。视频分区56.25%是用9除以16得出的16:9的比率。

如果需要动态处理任何纵横比，可以跳过以上步骤，使用jQuery插件，如FitVids.