<ul> <li><a href=""> <div class="wrap"> <div class="pic"><img src="http://www.gbtags.com/gb/laitu/200x200/dd4814/ffffff"> </div> <div class="txt">自适应<br></div> </div> </a></li> <li><a href=""> <div class="wrap"> <div class="pic"><img src="http://www.gbtags.com/gb/laitu/200x200/dd4814/ffffff"> </div> <div class="txt">自适应<br>自适应<br></div> </div> </a></li> <li><a href=""> <div class="wrap"> <div class="pic"><img src="http://www.gbtags.com/gb/laitu/200x200/dd4814/ffffff"> </div> <div class="txt">自适应<br>自适应<br>自适应<br></div> </div> </a></li> <li><a href=""> <div class="wrap"> <div class="pic"><img src="http://www.gbtags.com/gb/laitu/200x200/dd4814/ffffff"> </div> <div class="txt">自适应<br></div> </div> </a></li> </ul>
*{margin: 0;padding: 0;list-style: none;}
ul{width: 100%;}
li{width: 50%;float: left;border:5px solid transparent;box-sizing:border-box;}
li a{display: block;padding:10px 0;border: 1px solid #000;}
ul li .wrap{display: table;text-align: center;margin:0 auto;}
ul li .pic{text-align: right;width: 50%;display:table-cell;vertical-align: middle;}
ul li .txt{display:table-cell;text-align: left;padding-left: 5px;vertical-align: middle;width: 50%;}
ul li .pic img{width:80%;height: auto;max-width: 100px;min-width:50px;border: none;}