CSS让一个div相对于body水平垂直居中

实现如下

  1. 使用transform属性
body {
  background: black;

  margin: 0;
  position: relative;
}

div[id^="vjs_video_"]{
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
}
  1. 另一种方法
body {
    margin: 0;
    display: inline-block;
}

div {
    postion: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

tips

div[id^="vjs_video_"]这种写法表示,id以 "vjs_video_"这样开头的div则使用该样式