Html 如何在没有:之前的情况下垂直居中图像

Html 如何在没有:之前的情况下垂直居中图像,html,css,css-position,centering,pseudo-element,Html,Css,Css Position,Centering,Pseudo Element,我想知道是否有另一种方法可以不使用伪元素将动态大小的图像居中:before。谢谢 我喜欢这个选项。首先,将图像放置在容器的top:50%和left:50%位置,将图像的左上角放置在容器的中心。然后通过添加transform:translate(-50%,-50%)将图像向后移动一半大小,从而固定其位置 .container{ 位置:相对位置; 宽度:300px; 高度:200px; 边框:1px实心#ccc; 保证金:0自动; } .中心{ 位置:绝对位置; 最高:50%; 左:50%; 转换

我想知道是否有另一种方法可以不使用伪元素将动态大小的图像居中:before。谢谢

我喜欢这个选项。首先,将图像放置在容器的
top:50%
left:50%
位置,将图像的左上角放置在容器的中心。然后通过添加
transform:translate(-50%,-50%)
将图像向后移动一半大小,从而固定其位置

.container{
位置:相对位置;
宽度:300px;
高度:200px;
边框:1px实心#ccc;
保证金:0自动;
}
.中心{
位置:绝对位置;
最高:50%;
左:50%;
转换:翻译(-50%,-50%);
}

请查看并发布您的代码。