<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > < html xmlns ="http://www.w3.org/1999/xhtml" > < head > < meta http-equiv ="Content-Type" content ="text/html; charset=gb2312" /> < title > 一个div里面图片垂直居中的例子 </ title > < style type ="text/css" > <!--div {}{width:120px;height:100px;border:1px solid #ccc;overflow:hidden;position:relative;display:table-cell;text-align:center;vertical-align:middle;background-color:blue;}div span {}{position:static;+position:absolute;top:50%;}img {}{position:static;+position:relative;top:-50%;left:-50%;}--> </ style > </ head > < body > < div > < span > < img src =http://images.sohu.com/uiue/sohu_logo/beijing2008/sohu.gif > </ span > </ div > </ body > </ html >