How to center a video

时间:2017-02-16 作者:user113449

我无法将视频放在wordpress博客文章的中心。以下是视频使用的短代码:

[video width="1920" height="1080" m4v="http://p4s.ccafs.cgiar.org/wp-content/uploads/2017/02/RHoMIS-Fieldwork.m4v"][/video]
这是我上传的媒体中的mp4视频文件。我试着在我的风格中加入这一点。css,但仍然不起作用:

.wp-video {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
请帮忙。。。。

1 个回复
最合适的回答,由SO网友:Johansson 整理而成

要使元素居中,还必须设置其父元素的样式。比如说,你的视频有这样的结构:

<div class="parent-class"> 
    <video class="wp-video">
    </video>
</div>
要使视频居中,必须为其父视频指定一个宽度。使用:

.parent-class{
    width:100%;
    display:block;
}
现在,您可以使用此按钮进行最后触摸:

.wp-video {
    text-align: center;
    margin: 0 auto;
    max-width: 400px;
    display: block
}
请注意,您必须定义此视频的宽度,因为您的视频的宽度为1920px,这肯定会溢出大多数屏幕。

相关推荐

如何在WordPress中使用html和css定制帖子?

我试图在Internet和stackoverflow上查找信息,但什么都没有。因此,我已经将我的网站(html、css、js)迁移到WordPress(index.php、header.php、footer.php等),在将帖子添加到我的网站之前,我不知道如何更改帖子的视图。我可以看到四种方法:1) 下载WP插件以添加和自定义帖子。但我只能使用管理区域进行自定义,我不能使用HTML和CSS,选项很少(颜色、图片等)2) 创建一个单独的文件(sidebar.php)并将我的帖子添加到其中。但如果我的客户想自