这并不总是奏效……如果没有，试试:

img {
    display: block;
    margin: 0 auto;
}

如果你正在使用一个带有图像的类，那么下面的步骤就可以了

class {
    display: block;
    margin: 0 auto;
}

如果它只是一个图像在一个特定的类，你想居中对齐，那么下面将做:

class img {
    display: block;
    margin: 0 auto;
}

有时我们直接在WordPress管理员的页面中添加内容和图像。当我们将图像插入到内容中并想要对齐该中心时。代码显示为:

 **<p><img src="https://abcxyz.com/demo/wp-content/uploads/2018/04/1.jpg" alt=""></p>**

在这种情况下，你可以像这样添加CSS内容:

article p img{
    margin: 0 auto;
    display: block;
    text-align: center;
    float: none;
}

你可以在父元素上使用text-align: center，并将img更改为display: inline-block→，因此它的行为就像一个文本元素，如果父元素有宽度，它将居中!

img {
    display: inline-block
}

简单地改变父对齐:)

在父属性上试试这个:

text-align:center

这将不起作用，因为text-align属性适用于块容器，而不是内联元素，而img是一个内联元素。请参阅W3C规范。

用这个代替:

img。中心{ 显示:块; 保证金:0自动; ｝ < span style=" font - family:宋体;"> <img class="center" src ="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png?v=c78bd457575a"> < / div >