用DIV+CSS布局中,如何设置图片与文字在同一高度?

最新推荐文章于 2022-11-09 10:56:16 发布

gjpdeyx

最新推荐文章于 2022-11-09 10:56:16 发布

阅读量1w

点赞数

分类专栏：网页制作之DIV+CSS 文章标签： div css xhtml html border ie

本文链接：https://blog.csdn.net/gjpdeyx/article/details/5488248

版权

本文介绍了如何在使用DIV+CSS布局时，让图片与文字在同一高度并实现垂直居中。关键方法包括设置div的高度、line-height、vertical-align属性，以及在图片上使用align属性。对于IE6的兼容性问题，提到了避免使用padding并使用嵌套DIV进行调整。

摘要由CSDN通过智能技术生成

如果把文字和图片放在同一个图层的，文字可以做到居中，但是图片就不能，因为图片默认是左上对齐的！这就是为什么在制作的时候看到图片

会靠上的原因。如果你令到图片居中了，文字就会相对于图片右下对齐了！如果你想2个都居中的话，就不能把他们放在同一个div,或者你试下

把他们放在2个div中，或者一个图片放div中，文字直接放页面中，不放div ，这样还可以给网页瘦身。

把那个放图片和文字的层css设置为比如id叫#aa

#aa {height: 30px; line-height:30px; vertical-align: middle;}

这样就可以使里面的东西在层里垂直居中了。一定要设置相同高度和间距。

把图片加上align="absmiddle"





<img src="http://img.baidu.com/img/logo-zhidao.gif
" align="absmiddle" />

关注

专栏目录