在div中居中图像

Question

我想使用css在div中(水平地)居中(内联)三个图标。我的div在另一个div中居中，但我希望内容(三个图标)在该div中居中。

<div id="browsers">
  <div id="browsers-wrapper">
  <img src="Images/firefox.png" class="browserIcons">
  <img src="Images/chrome.png"  class="browserIcons">
  <img src="Images/opera.png"   class="browserIcons">
  </div>
</div>

还有一篇关于使用css将内容居中的有用文章，以了解有关该过程的更多信息？

谢谢!

Answer 1

实际上，我自己也做到了！我仍然需要了解有关块和内联元素的基本知识。

不过还是要谢谢你。

#browsers-wrapper img{
   display:inline;
   margin:auto;
   width: 8%;
   height:auto;

}

Answer 2

尝试以下命令，它可能会起作用：

#beowser-wrapper img {
margin : auto 0;
display : block;
width : 100%;
}

我推荐在本教程中查看一下，它描述了这些元素Learn CSS Layout

在这里，您还可以查看图片示例中描述的内联和块元素：What’s the Deal With Display: Inline-Block?

我希望这对你有足够的帮助。