图片在DIV中永远居中
<div id="div_image_box_wrapper1">
<div id="div_image_box_wrapper2">
<div id="div_image_box">
<img src="*.jpg" />
</div>
</div>
</div>
#div_image_box_wrapper1 {
width:580px; height:358px;
display:table-cell;
vertical-align:middle;
}
#div_image_box_wrapper2 {
width:580px; height:358px;
overflow:hidden;
display:table;
}
#div_image_box {
display: table-cell;
vertical-align:middle;
text-align:center;
}
/*for IE*/
#div_image_box_wrapper2 {
*position:relative;
}
#div_image_box {
*width:100%;
*position:absolute;
*top:50%;
*left:0;
}
#div_image_box img{
*position:relative;
*top:-50%;
*margin:0;
*padding:0;
}
#div_image_box img{
*margin-top:2px;
*margin-bottom:2px;
}/*for IE bug*/
分享到:
相关推荐
主要介绍了Jsp中如何让图片在div中居中的小技巧,需要的朋友可以参考下
在DIV中图片垂直/水平居中(最简单方法)
任意图片在div里的垂直居中!
DIV+CSS 图片垂直居中效果
图片居中到div中显示
如果图片在div中下的span属性中,必须转换成display:block;然后padding-top:10px。 以上就是小编为大家带来的解决img在div中居中的问题的全部内容了,希望对大家有所帮助,多多支持软件开发网~
DIV+CSS 图片居中效果 兼容 IE FF。。等浏览器
div 图片上下居中,左右居中 ,兼容多版本浏览器
div相对与table对于图片的垂直居中支持的并不好,特别对于不同浏览器的兼容性来说,这里我们看下一个简洁的css解决方法: 在曾经的 淘宝UED 招聘 中有这样一道题目: “使用纯CSS实现未知尺寸的图片(但高宽都小于200px...
DIV+CSS上下左右绝对居中
介绍: 很多朋友都在问这个问题,div的内容图片垂直居中代码,这个代码兼容多浏览器。
这是几种图片在div层的居中方法,其中垂直居中不好实现的问题是兼容性问题,其中有兼容性不错的居中方法实例。
用CSS来实现img图片在DIV层中上下左右都居中,并且图片等比例缩放。很实用的
一款不需要任何JS即可控制图片上下左右居中的效果 以前以为必须要JS才能控制图片上下居中的,现在才发现原来css也有这个本事 一半只有table,默认图片才会上下居中,现在只需要加几行css即可实现,高级。使用方法...
NULL 博文链接:https://highfly-s.iteye.com/blog/1878910
不定宽高元素的垂直和水平居中,兼容IE67
div+css布局限制图片最大宽度图片水平垂直居中兼容IE6
博文链接:https://bazhuang.iteye.com/blog/156001