【IT168 论坛采风】在一个容器里再定义一个绝对定位的p容器,再在p容器里放需要垂直居中的图片,图片定义相对定位的CSS。
相关精彩文章
直接上CSS代码:
|
#pic { width:300px; height:300px; background-color:green; border:6px solid #ccc; text-align:center; position:relative; display:table-cell; vertical-align:middle; } #pic p { *position:absolute; top:50%; left:50%; } #pic p img { *position:relative; top:-50%; left:-50%; } |
#pic是容器,里面放一个p容器,该容器采用绝对定位,最后插入图片,图片采用相对定位。
这里用到了一个hack,*只有IE浏览器可以识别,Firefox不认识。
更多热点:Dreamweaver8 开发ASP动态网站 Office2007系列视频教程 DIV+CSS网页布局详解