<div>
<p><img /></p>
</div>
一 div顯示為表格框 (本人未測(cè)試通過(guò))
div{display:table-cell; /* 也可為table等 */
vertical:middle; /* 只有firefox在去掉以上屬性時(shí)，支持此屬性 */
}
二 采用絕對(duì)地址和外邊距居中 （推薦,不用看也可以通過(guò)）
div{position:relative; /* 可無(wú)需設(shè)置left等，此屬性主要是為內(nèi)部標(biāo)簽p定位 */
height:xxpx;
}
p{position:absolute;
margin-top:－(自身高度/2);
}
三 定義p{inline-block;.....}為行框來(lái)填充img的上面距離實(shí)現(xiàn)居中。代碼略。(未測(cè)試)
四 元素內(nèi)元素垂直居中 （定位不是十分精確，差別不大，好像只適用于單行。測(cè)試通過(guò)）
div{line-height:500px; /* line-height與height相同 */
height:500px;
}
posted on 2009-10-15 16:05
紫蝶∏飛揚(yáng)↗ 閱讀(474)
評(píng)論(0) 編輯 收藏 所屬分類:
CSS 、
div+css+js代碼