<pre class="prettyprint lang-html">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>
    div+css布局限制图片最大宽度图片水平垂直居中兼容IE6
</title>

<meta name="description" content="div+css布局通过样式表设置容器内容图片的最大图片宽度和最小宽度，让图片等比例缩放，让图片垂直居中和图片水平居中。" />

<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
.demo{width:990px;margin:0 auto;}
.demo li{float:left;margin:10px;width:220px;height:230px;overflow:hidden;border:solid 1px

#ddd;display:inline;}
.demo li .subsummary{height:24px;line-height:24px;overflow:hidden;padding:0

5px;border-top:solid 1px #ddd;background:#EFFBFF;text-align:center;}
.demo li .subsummary a{font-size:12px;text-decoration:none;color:#3366cc;}
/* ver_pic */
.ver_pic{width:220px;height:230px;background-color:#eee;text-

align:center;position:relative;display:table-cell;vertical-align:middle;}
.ver_pic .subpic{*position:absolute;top:50%;left:50%;}
.ver_pic .subpic img{*position:relative;top:-50%;left:-50%;}
.ver_pic .subpic img{
  max-width:140px;
  min-width:120px;
  width:expression(this.width > 140 ? "140px" : this.width);
}
</style>

<div class="demo">
    
    <ul>
        
        <li>
            
            <div class="ver_pic">
                
                <div class="subpic">
                    <a href="http://www.rongsoft.cn/" target="_blank"><img alt="多用户商城平台开发" src="http://www.rongsoft.cn/1.jpg" /></a>
                </div>

            </div>

        </li>

        <li>
            
            <div class="ver_pic">
                
                <div class="subpic">
                    <a href="http://www.rongsoft.cn/" target="_blank"><img alt="商城系统" src="http://www.rongsoft.cn/2.jpg" /></a>
                </div>

            </div>

        </li>

        <li>
            
            <div class="ver_pic">
                
                <div class="subpic">
                    <a href="http://www.rongsoft.cn/" target="_blank"><img alt="微信商城定制开发" src="http://www.rongsoft.cn/3.jpg" /></a>
                </div>

            </div>

        </li>

        <li>
            
            <div class="ver_pic">
                
                <div class="subpic">
                    <a href="http://www.rongsoft.cn/" target="_blank"><img alt="APP定制开发" src="http://www.rongsoft.cn/4.jpg" /></a>
                </div>

            </div>

        </li>

        <li>
            
            <div class="ver_pic">
                
                <div class="subpic">
                    <a href="http://www.rongsoft.cn/" target="_blank"><img alt="O2O电商系统定制" src="http://www.rongsoft.cn/5.jpg" /></a>
                </div>

            </div>

        </li>

        <li>
            
            <div class="ver_pic">
                
                <div class="subpic">
                    <a href="http://www.rongsoft.cn/" target="_blank"><img alt="O2O电商系统定制" src="http://www.rongsoft.cn/6.jpg" /></a>
                </div>

            </div>

        </li>

        <li>
            
            <div class="ver_pic">
                
                <div class="subpic">
                    <a href="http://www.rongsoft.cn/" target="_blank"><img alt="O2O电商系统定制" src="http://www.rongsoft.cn/7.jpg" /></a>
                </div>

            </div>

        </li>

        <li>
            
            <div class="ver_pic">
                
                <div class="subpic">
                    <a href="http://www.rongsoft.cn/" target="_blank"><img alt="O2O电商系统定制" src="http://www.rongsoft.cn/8.jpg" /></a>
                </div>

            </div>

        </li>

    </ul>

</div>

<div style="width:960px;margin:10px auto;clear:both;text-align:center;">
    
<script src="/statics/js/ad/96090.js" type="text/javascript"></script>

</div>

<div style="width:960px;margin:20px auto;clear:both;text-align:center;font-size:12px;line-height:25px;">
    <a href="http://www.rongsoft.cn " style="color:#333;"><strong>烟台荣华软件科技有限公

司</strong></a> <a target="_blank" href="http://www.rongsoft.cn"><img src="http://www.rongsoft.cn/group.png" alt="烟台荣华软件" border="0" /></a> <a style="style:none;" href="http://www.rongsoft.cn" target="_blank"><strong></strong></a>
<script src="/statics/js/inc_share.js" type="text/javascript"></script>

<script src="/statics/js/inc_statistics.js" type="text/javascript"></script>

<script src="/statics/js/inc_monitor.js" type="text/javascript"></script>

</div>
</pre>