Question

即使图像的宽度和高度设置为自动，有没有办法使图像居中？这是我的代码：

.IMGContainer {
width: 100%;
max-width: 100%;
height: 50%;
max-height: 50%;
top: 24%;
position: absolute; 
display: block;
}
.IMGContainer img {
position: absolute;
height: auto;
width: auto;
max-height: 80%;
max-width: 80%;
}

图像有点风景我不得不使用自动设置的高度和宽度;即使宽度和高度未确定，我可以使用什么来使图像居中？

Answer 1

尝试

DEMO

 .IMGContainer img{
        height: auto;
        width: auto;
        position:absolute;
        margin:auto;
        top:0;
        right:0;
        bottom:0;
        left:0;
       }

注意：css块

position:absolute;
            margin:auto;
            top:0;
            right:0;
            bottom:0;
            left:0;

将图像置于容器中心.. !!

Answer 2

   .IMGContainer img{
    width: auto;
    position:absolute;
    margin:auto;
    top:0;right:0;bottom:0;left:0;
     }

将x的值更改为合适的值。

参考 - Center anchor with image in div

对齐容器内的图像（宽度自动和高度自动）

2 个答案: