.container {
  position: relative;
  background-color: #e1e1e1;
  width: 300px;
  height: 300px;
}

.center {
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: pink;
  transform: translate(-50%, -50%);
/*   不加这行代码，子左上角在父中心，加上后相对自身位移负宽高的一半，实现居中 */
  width: 200px;
  height: 100px;
}