如何让div中的图片垂直居中对齐?
5个回答
展开全部
图片水平垂直居中情况很多,最简单的办法是吧图片设置为背景,给背景设置background-position:center;
如果只能用图片
分两种情况:
1.图片宽高固定,这种情况很简单。
水平居中:就在图片的css中加 dispaly:block;margin:0 auto;
垂直居中:自己算出(div的高度-图片的高度)/2,得到margin-top值即可。
2.图片高度未知,这个布局比较难实现。一般我是用js做的。
水平居中:同上,在图片的css中加 dispaly:block;margin:0 auto;
垂直居中:用js算出(div的高度-图片的高度)/2,得到margin-top值赋给它。
曾经研究过网上的很多方法,个人觉得这个是最有效的了。
如果只能用图片
分两种情况:
1.图片宽高固定,这种情况很简单。
水平居中:就在图片的css中加 dispaly:block;margin:0 auto;
垂直居中:自己算出(div的高度-图片的高度)/2,得到margin-top值即可。
2.图片高度未知,这个布局比较难实现。一般我是用js做的。
水平居中:同上,在图片的css中加 dispaly:block;margin:0 auto;
垂直居中:用js算出(div的高度-图片的高度)/2,得到margin-top值赋给它。
曾经研究过网上的很多方法,个人觉得这个是最有效的了。
展开全部
给div设定text-align:center;可使图片水平居中,再给图片img设定 vertical-align:middle;即可达到垂直居中(切记,是给图片加,不是div,很多人容易搞错)
还有一个方法,就是用table布局,td默认是水平方向居左的,但是垂直方向是居中的,所以你套一个table后再插入图片的话,也能很好的达到垂直居中
还有一个方法,就是用table布局,td默认是水平方向居左的,但是垂直方向是居中的,所以你套一个table后再插入图片的话,也能很好的达到垂直居中
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
表格不太好,但我觉得不妨用用,要不你在div里面加个table,宽度100%,一行一列,图片放里面,然后用valign属性试试
<td valign="middle"></td>
<td valign="middle"></td>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
一楼说的对,设置背景最简单,垂直居中的话,应该设置行高也能解决。 比如:div为height 50px
line-height:50px ,text-align:center . display:block.
line-height:50px ,text-align:center . display:block.
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
2013-03-24
展开全部
Vertical-align:center;
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询