Html 在图像中心嵌入视频

我正在尝试将视频与图像的中心对齐

.vbbackground{
背景图像：url（'http://s1.postimg.org/hdo0xh2of/image.png');
背景重复：无重复；
宽度：600px；
高度：600px；
位置：相对位置；
}
#匹配{
位置：绝对位置；
排名：0；
底部：0；
左：0；
右：0；
保证金：自动；
}

---

只需添加

左边距：自动

和

右边距：自动

；与你的

#匹配

CSS样式，它会将视频与图像中心对齐

#匹配{
左边距：自动；
右边距：自动；
}

尝试从

匹配

id选择器中删除

位置：绝对

规则，并将

.vbackground

类上的

文本对齐

属性设置为

中心

这应该是有效的-

.vbackground {
    background-image: url('http://s1.postimg.org/hdo0xh2of/image.png');
    background-repeat: no-repeat;
    width: 600px;
    height: 600px;
    position: relative;
    text-align: center;
 }    
 #match {
    /*position: absolute;*/
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

---

刚刚意识到使用

文本对齐：居中图像定位规则（请参阅）。您可以将.vbackground的宽度和高度分别设置为原始图像的大小，即594px/372px。