div中如何设置table表格图片不超过边框

为了效果明显一点我特意所有的元素都加上边框

这个是css

   #div_bottom_right_inner {
        margin-top: 5%;
        margin-left: 10%;
        margin-right: 10%;
        border:1px solid black;
        height:75%;
        padding-left: 100px;
        padding-right: 100px;
        over-flow:auto;(顺便说下,这句话去掉也不行,加上也是不对的)
    }
        #tab_img {
        height: 100%;
        width: 100%;
        border: solid thin red;
        table-layout: fixed;
        over-flow:auto;(顺和上面的一样,这句话去掉也不行,加上也是不对的)
    }
    #tab_img td {
        border: solid thin red;
    }
    #tab_img img {
        height: 100%;
        width: 100%;
    }

下面是html

 <div id="div_bottom_right_inner">
            <table id="tab_img">
                <tr>
                    <td><img src="../static/images/book.jpg" ></td>
                    <td></td>
                    <td><img src="../static/images/think.jpg" ></td>
                    <td></td>
                    <td><img src="../static/images/animals.jpg"></td>

                </tr>
                <tr>
                    <td></td>
                    <td><img src="../static/images/community.jpg"></td>
                    <td></td>
                    <td><img src="../static/images/book.jpg" ></td>
                    <td></td>

                </tr>
            </table>
    </div>

图片说明

请问各位老师,怎么设置可以让图片不超过表格,无论图片多大,如果太大就自动缩小,如果太小就自己放大。这样无论什么多大窗口都可以看到完整的图片。谢谢

 #tab_img img {
        height: 100%;
        width: 100%;
    }
  这里使用 单位px 多大自己定义

理论上来说,表格的td如果不设置高度,应该是可以自适应内容的高度的呀。

你想图片不超过td那你就需要手动设置td的height,width.然后给 #tab_img img{width=td.width;height=td.height.}_