DIV中图片垂直居中
2012-09-27 10:10
417 查看
<!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=utf-8" /> <meta name="description" content="图片在DIV中垂直水平都居中" /> <meta name="keywords" content="图片在DIV中垂直水平都居中" /> <meta name="author" content="liu" /> <title>图片在DIV中垂直水平都居中</title> <style> .middle-out{width:708px;height:385px;position: relative;display: table-cell;vertical-align:middle;border:1px solid #f00;text-align:center;} .middle-in{position:static;*position:absolute;top:50%;} .middle-out .middle-in img{position:static;*position:relative;top:-50%;left:-50%;} </style> </head> <body> <div class="middle-out"> <div class="middle-in"> <img src="http://s2.sinaimg.cn/mw690/4990aec6h9669862fd7e1&690" /> </div> </div> </body> </html>
相关文章推荐
- 不定宽高div内图片垂直居中的css样式
- Div中图片垂直居中与文字对齐
- 关于div中图片水平垂直居中的问题
- Web开发教程--如何让图片在div中垂直居中
- 让图片在div里面垂直居中
- js 获取div的类及js控制图片垂直居中
- css样式实现左边的固定宽度和高度的图片或者div跟随右边高度不固定的文字或者div垂直居中(文字高度超过图片,图片跟随文字居中,反之文字跟随图片居中非table实现)
- CSS设置 使div中的图片垂直上下居中
- 网页常见布局,让图片在div中,垂直居中,水平居中
- div和图片垂直居中问题
- CSS图片在DIV中水平垂直居中
- 图片在div中垂直居中
- 图片垂直居中之姊妹 DIV垂直居中
- div,li内部图片自适应水平垂直居中
- 未知高度的图片在div设置垂直居中
- 未知宽高图片水平垂直居中在div
- 用css实现图片在div内的垂直居中
- 让图片在DIV容器里面水平垂直居中的方法
- 图片与DIV相互垂直居中