html - bootstrap 3 中的图像不会移动到中心

Question

所以我正在制作一个网站，我试图让我的图像位于中心或下方一点，但它不会发生。每次我尝试它都停留在 t`enter code here

<img src="http://i2.wp.com/ajournalofmusicalthings.com/wp-content/uploads/Question-mark.png?resize=512%2C350" alt="..." class="img-thumbnail">
<img src="http://i2.wp.com/ajournalofmusicalthings.com/wp-content/uploads/Question-mark.png?resize=512%2C350" alt="..." class="img-thumbnail">
<img src="http://i2.wp.com/ajournalofmusicalthings.com/wp-content/uploads/Question-mark.png?resize=512%2C350" alt="..." class="img-thumbnail">



.image-thumbnail {
  position: absolute;
  top: 80%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  background-color: #3B393E;
}

我不明白我做错了什么。

Answer 1

然后将其包裹在一个 div 中并使用 text-align:center 来完成这项工作:

.image-thumbnail{transform:translateX(-50%) translateY(-50%); background-color: #3B393E;}

.myclass {
  width: 100%;
  text-align: center;
}

<div class="myclass">

  <img src="http://i2.wp.com/ajournalofmusicalthings.com/wp-content/uploads/Question-mark.png?resize=512%2C350" alt="..." class="img-thumbnail">
      <img src="http://i2.wp.com/ajournalofmusicalthings.com/wp-content/uploads/Question-mark.png?resize=512%2C350" alt="..." class="img-thumbnail">
      <img src="http://i2.wp.com/ajournalofmusicalthings.com/wp-content/uploads/Question-mark.png?resize=512%2C350" alt="..." class="img-thumbnail">
  
</div>