css - 如何让table的大小根据外层容器的大小自适应呢？

问题描述

问 题

<div class="wrapper">
   <table cellpadding="0" cellspacing="0" >
     <tr>
       <td><img src="http://www.narutom.com/d/file/pic/naruto_pic/2008-11-26/4b4f0598b35bf1b73bd5d1abf45c3f01.jpg" /></td>
       <td><img src="http://www.narutom.com/d/file/pic/naruto_pic/2008-11-26/4b4f0598b35bf1b73bd5d1abf45c3f01.jpg" /></td>
     </tr>
     <tr>
       <td><img src="http://www.narutom.com/d/file/pic/naruto_pic/2008-11-26/4b4f0598b35bf1b73bd5d1abf45c3f01.jpg" /></td>
       <td><img src="http://www.narutom.com/d/file/pic/naruto_pic/2008-11-26/4b4f0598b35bf1b73bd5d1abf45c3f01.jpg" /></td>
     </tr>
   </table>
</div>
*{padding:0;margin:0;}
.wrapper{width:280px;}
.wrapper table{width:100%;}
.wrapper img{display:block;}

现在table的大小是根据td的内容决定的。我要实现的效果是table里边td的图片根据外层的容器wrapper的大小进行自适应缩放该怎么实现呢？

解决方案

.wrapper img{display:block;width:100%;}

这篇关于css - 如何让table的大小根据外层容器的大小自适应呢？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！