提示：您可以先修改部分代碼再運行
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br /><html xmlns="http://www.w3.org/1999/xhtml"><br /><head><br /><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></p><style type="text/css">.miao{width:170px;height:100px;display:table;text-align:center;border:solid 1px red;}.miao span{display:table-cell;vertical-align:middle;border:solid 1px blue;}.miao span img{border:dashed 1px green;}</style><p><!--[if lte IE 7]></p><style type="text/css">.miao{position:relative;overflow:hidden;}.miao span{position:absolute;left:50%;top:50%;}.miao span img{position:relative;left:-50%;top:-50%;}</style><p><![endif]--><br /></head><br /><body></p><h1>固定高寬的容器中，圖片垂直局中。</h1><p>綠色容器是span，目的是使自己的左上方與容器中心點對齊。紅色是具體圖片，再次設定負值使自己的中心點和父容器的中心點重合，最終達到垂直局中的目的。</p><div class="miao"><span></span></div><hr /><div class="miao" ><span></span></div><hr /><div class="miao" ><span></span></div><p></body><br /></html></td> </tr></table>
提示：您可以先修改部分代碼再運行
