编码网页，无法弄清楚如何将图像居中放置在文本框中

Question

我已经尝试了几种方法，并且不会改变。我有以下代码。我要做的就是将图像居中放置在文本框中。我似乎无法弄清楚。 ？我尝试了一些W3School和其他一些，但是每当尝试它们的示例时，图像都不会居中。这只是一个图像和文本的示例。

    </div>
    <div class="col-sm-4">
       <h3 style="color:black;">APA 7th Edition. What is different? </h3>
        <style>
       .img-container {
      text-align: center;
    }
  </style>

  <div class="img-container"> <!-- Block parent element -->
         <img src="APA.jpg">

       <a href="Jobs.html">
       <p class="inset">The 7th edition APA manual has been released.  Do you know what the 
       differences are?</p>
       <p><br />

   </div>

Answer 1

您可能应该考虑将margin: auto添加到图像中，以使其自动居中居中。要使文本居中，它是text-align: center。正确的方法是将您的两个项目放在一个容器中。

.container{
  width: auto;
  text-align: center;
}

.images {
  margin: auto;
}

<div class="container">
  <img class="images" src"http://images.jpg" alt="images">
  <a href="#"><p>The 7th edition APA manual has been released. Do you know what the differences are?</p></a>
</div>