css - 如何将此幻灯片定位到页面中心？

Question

我在这里的一个网站上工作：

http://bit.ly/1ianglg

我的问题是：是否可以将整个滑块定位到页面的“中间”？我能想到的一种方法是改变每个图像，使得每个图像周围都有一个空白框架，基本上将它们渲染成相同的大小（但视觉上“居中”）......但是有没有办法做到这一点CSS？基本上，有没有一种方法，无论图像大小如何，都可以将每个图像的中心尽可能靠近页面中心对齐？

谢谢！

Answer 1

我相信你最好的选择是让图像成为 div 的背景图像，并使用no-repeat center center它来完成艰难的提升：

.example {
    background:url('url_of_the_image.png') no-repeat center center;
}

带有示例的jsFiddle 。您唯一需要注意的是 div 的大小大于或等于最大图像。