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%);
}

2. 另一種方法

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則使用該樣式