html – 位置绝对的transform-origin等价物

我得到了一个大小未知的元素,其中position = absolute,top = 1000,left = 1000.

现在,该元素的左上角位于(1000,1000),但我希望元素的中心为(1000,1000).

有没有办法单独使用CSS？

最佳答案

正如the comments中所指出的,您可以简单地使用transform：translate(-50％,– 50％)来垂直/水平居中元素.幸运的是,这种方法适用于动态值,这意味着它可以很好地适用于您的情况,因为您不知道元素的宽度/高度.

例如：

.element {
  background: #f00;
  width: 100px;
  height: 100px;
  transform: translate(-50%,-50%);
  position: absolute;
  top: 50%;
  left: 50%;
}

对于它的价值,这里有some alternative methods垂直/水平定心.