已解決430363個問題，去搜搜看，總會有你想問的

怎么居中顯示一個自適應寬高的div？

關注

首頁猿問怎么居中顯示一個自適應寬高的div？

Html/CSS

yangwwei 2016-04-13 23:48:45

比如有個一個div。。里面包含著一個img元素。。如何使得這個div的寬高自適應。。而且使得div在屏幕中居中顯示？？

查看完整描述

6 回答

穎子黑豆

TA貢獻9條經驗獲得超7個贊

可以設置display:inline 然后設置text-align:center

2 反對回復 2016-04-15

淡雅的默

TA貢獻102條經驗獲得超139個贊

div{width:auto;margin:auto;height:auto; position:relative}

1 反對回復 2016-04-14

yangwwei
你好。。這樣好像并不能解決問題啊。。下面的不能達到效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style> *{margin:0px;padding:0px;font-size:15px;} ul,ol{list-style: none ;} #box{width:auto;margin:auto;height:auto; position:relative;} </style> <body> <div> <div id="box"> <ul> <li><img src="http://img1.sycdn.imooc.com//54111cd9000174cd04900170.jpg" alt=""></li> <li><img src="http://img1.sycdn.imooc.com//54111dac000118af04900170.jpg" alt=""></li> <li><img src="http://img1.sycdn.imooc.com//54111d9c0001998204900170.jpg" alt=""></li> <li><img src="http://img1.sycdn.imooc.com//54111d8a0001f41704900170.jpg" alt=""></li> <li><img src="http://img1.sycdn.imooc.com//54111d7d00018ba604900170.jpg" alt=""></li> </ul> </div> </div> </body> </html>

回復 2016-04-14
淡雅的默
#box { width:auto; max-width:490px; margin:auto; height:auto; position:relative; }

回復 2016-04-14

qq_夢繁花會開_0

TA貢獻1條經驗獲得超1個贊

position:absolute就是脫離正常文本流了，沒有辦法撐起父元素的寬高。

1 反對回復 2016-04-14

猿小天

TA貢獻5條經驗獲得超0個贊

高度要設置多少像素，寬度用auto

反對回復 2016-04-14

一毛錢

TA貢獻156條經驗獲得超57個贊

{margin:0px?auto}

反對回復 2016-04-14

關注