这里mainContainer设置为显示：table和horizo??n设置为display：table-cell.
不幸的是,当图像成为这种结构的一部分时,图像不再按比例调整大小.一旦我将它移动到table / table-cell div中,它就会调整为原始大小(而不是按比例调整大小,因为max-width：100％和max-height：100％)
见：http://jsfiddle.net/U8KcN/
编辑：
My bad. I just tried to simplify the issue. I want to build a little slideshow for images. The problem here is that I do not know which sizes the images are (referring to someone else using the slideshow). So in simple terms I need a specific CSS that 1) centers the image vertically and horizontally in the div if its width and height are smaller than the div’s dimensions,2) resizes the image automatically if it is bigger than the div’s dimensions (unnecessary to add,it is unknown whether it’s width or height is bigger).
来源：OP Comment
如何放弃那些“CSS-table”的东西并且做得更容易一些？
至少,这就是我如何处理它……
编辑：
请注意,我已将CSS内联显示为哪个元素应该获得什么样式.在制作中,您应该 – 作为对此答案的正确陈述的评论 – 始终将样式与代码分开.所以,实际上,你最终会得到这样的东西：
编辑2：
回复相关评论,这里是更新,使图像按比例适合父母：
如果你的图像宽度大于高度……
或者,如果您的图像宽度小于高度…
编辑3：
看着你的小提琴,我想出了这个就像你希望它起作用一样：
我已经把你的小提琴分开来显示更新：http://jsfiddle.net/LPrkb/1/
编辑3：
由于OP似乎无法确定他需要什么,我将根据他的最新评论添加此最终编辑.
您还可以在“mainContainer”上使用带有“background-size：contains”的CSS背景图像并完成它…查看http://jsfiddle.net/HGpfJ/2/或者查看这个100％工作示例采用完全不同的方法,这样做只会导致相同的效果/功能：
让我们面对事实：根据文档结构中您希望图像“居中”的位置,有十多种方法可以实现.
如果OP需要特定代码,我们将需要来自OP的完整文档结构,而不仅仅是一个“通用”代码片段,它可以在任何文档结构中的任何位置.
（编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
