读书人

Div图片垂直居中的步骤

发布时间: 2012-11-23 00:03:43 作者: rapoo

Div图片垂直居中的方法

css:

<style>
.box?{
????????/*非IE的主流浏览器识别的垂直居中的方法*/
????????display:?table-cell;
????????vertical-align:middle;

????????/*设置水平居中*/
????????text-align:center;

????????/*?针对IE的Hack?*/
????????*display:?block;
????????*font-size:?175px;/*约为高度的0.873,200*0.873?约为175*/
????????*font-family:Arial;/*防止非utf-8引起的hack失效问题,如gbk编码*/

????????width:200px;
????????height:200px;
????????border:?1px?solid?#eee;
}
.box?img?{
????????/*设置图片垂直居中*/
????????vertical-align:middle;
}
</style>?

?

?

html:

?

?<div?class="box"><a?href="http://www.howpm.com"?target="_blank"><img?src="http://howpm.com/images/dz7/logo.gif"?/></a></div>

读书人网 >Web前端

热点推荐