您可以将图像放置在一个div中，添加一个div id，并让该div的CSS具有文本align:center:

HTML格式：

<div id="intro_img">

    <img src="???" alt="???">

</div>

CSS:

#intro_img {
    text-align: center;
}

据我所知，对于未知的宽度，这是不可能实现的。

如果这在您的场景中有效，您可以绝对定位一个100%宽度和高度的不可见元素，并使用margin:auto和可能的垂直对齐将元素居中。否则，您将需要JavaScript来执行此操作。

您可以将图像放置在一个div中，添加一个div id，并让该div的CSS具有文本align:center:

HTML格式：

<div id="intro_img">

    <img src="???" alt="???">

</div>

CSS:

#intro_img {
    text-align: center;
}

<div style='position:绝对；左：50%；顶部：50%；转换：转换（-50%，-50%）'>此文本居中。</div>

这将使div中的所有对象居中，位置类型为static或relative。

HTML

<div id='parent'>
  <div id='centered-child'></div>
</div>

CSS

#parent {
  position: relative;
}
#centered-child {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto auto;
}

http://jsfiddle.net/f51rptfy/

响应式解决方案

假设div中的元素是另一个div。。。

此解决方案运行良好：

<div class="container">
  <div class="center"></div>
</div>

容器可以是任何大小（必须是相对位置）：

.container {
    position: relative; /* Important */
    width: 200px; /* Any width */
    height: 200px; /* Any height */
    background: red;
}

元素（div）也可以是任何大小（必须小于容器）：

.center {
    position: absolute; /* Important */
    top: 50%; /* Position Y halfway in */
    left: 50%; /* Position X halfway in */
    transform: translate(-50%,-50%); /* Move it halfway back(x,y) */
    width: 100px; /* Any width */
    height: 100px; /* Any height */
    background: blue;
}

结果将是这样的。运行代码段：

.容器{位置：相对；宽度：200px；高度：200px；背景：红色；}.中心{位置：绝对；顶部：50%；左：50%；转换：转换（-50%，-50%）；宽度：100px；高度：100px；背景：蓝色；}<div class=“container”><div class=“center”></div></div>

我觉得这很有帮助。