css 垂直使用css对齐任何内容

Posted 2021-05-13

/* * *This method prevents elements from being blurry due to the element being placed on a “half pixel”. 
A solution for this is to set its parent element to preserve-3d* * */
.parent-element {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.element {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}