居中图片

Question

我想将图像置于隐藏溢出的div中

就像一个帧然后是图片而不管大小是否居中。

<div class="holder">
   <div id="frame">
      <img src="http://www.travelblog.org/Wallpaper/pix/tb_fiji_sunset_wallpaper.jpg" class="centerme"/>
   </div>
</div>​

查看图片了解更多信息：

标准状态是溢出的总是如何：隐藏;

但是需要它始终将中心的图片放在比框架大3倍的中心

*继承人JSfiddle http://jsfiddle.net/UL3qp/4/

*编辑
最后需要的是循环此事件

Answer 1

http://jsfiddle.net/HCabZ/2/尝试使用垂直对齐中心以及右对齐和右对齐。离开中心

Answer 2

将图片居中with jQuery is simple - 通过设置正面或负面margin-left属性：

$(document).ready(function(){
    var fwidth = $('#frame').width();
    var iwidth = $('#frame img').width();
    $('#frame img').css('margin-left', Math.floor((fwidth-iwidth)/2));
});

只使用纯CSS，可以通过a background image css property而不是img标记来完成。

Answer 3

添加样式：

#frame{padding:15px; text-align:center}
#frame img{max-width:100%}

检查这个小提琴http://jsfiddle.net/HCabZ/