css - 垂直居中图像

Question

我开发了一个图片库网站。目前，每张图片都与顶部对齐，我希望图片位于 DIV 的中心。

这是我的代码:

.carousel .item {
  height: 900px;
  background-color: #777;
}
.carousel-inner > .item > img {
    top:5%;
    display: block;
    margin-left: auto;
    margin-right: auto  
}

这是我的网站链接，您也可以看到它的实际效果:http://www.canninginc.co.nz/canluciddream/screenshots.html

最后一张图片就是一个很好的例子。这是一张小图片，我希望将它垂直放置在中央。

Answer 1

试试这个 CSS

.carousel .item {
        position:relative;
        height: 900px;
        background-color: #777;
}
.carousel-inner > .item > img {
        display: block;
        margin: auto;
        position: absolute;
        top: 0; left: 0; bottom: 0; right: 0;
 }

试试这个，很有帮助Absolute Horizontal And Vertical Centering In CSS