一组高度不确定的img垂直居中,大牛帮看一下怎么实现不了

<!Doctype html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width,inicial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
  <title></title>
  <style>
    *{margin:0;padding:0;}
    body{font-size:1.5625vw;}
    #container{width:100%;height:200px;border-right:none;display:table-cell;vertical-align:middle;}
    #container #img{width:32vw;height:100px;border:1px solid #EEE;float:left;text-align:center;}
    #container #img img{max-width:32vw;max-height:100px;}
  </style>
</head>
<body>
  <div id="container">
    <div id="img"><img src="http://www.ekxw.org.cn/imgall/onuc4njsgvvc4y3pnuxgg3q/ck/UpLoad/Pic/Pic201402071740426657.jpg" alt=""/></div>
    <div id="img"><img src="http://www.wanchaow.com/upload_files/wc_news_/132/52_1375521136_1574707.jpg" alt=""/></div>
    <div id="img"><img src="http://newpaper.dahe.cn/jrxf/images/2013-05/10/B12/p104_b.jpg" alt=""/></div>
    <div id="img"><img src="http://sh.525j.com.cn/ck/UpLoad/Pic/Pic201402080942184001.jpg" alt=""/></div>
    <div id="img"><img src="http://www.028dayu.com/uploadfile/2013/0217/20130217013424652.jpg" alt=""/></div>
    <div id="img"><img src="http://www.3tui.com.cn/CommonHelp/UEditor/net/upload/2015-03-12/85b295b5-7b54-4fb3-9e02-3c1c4b162a52.jpg" alt=""/></div>
</div>
</body>
</html>

Alphonse丿
浏览 2123回答 5
5回答

swust_li

id选择器名字是唯一的,不能重复,垂直居中可以试试设置line-height属性

5E

vertical-align这个属性试试看。
打开App,查看更多内容
随时随地看视频慕课网APP