table 的td里面写了div的border为什么和边框有空白的间隙？利用cellspacing="0" cellpadding="0"

 

 

从上面的图可以看出来。这个td里面的div和边框中总是有白边，即使我设置了div的width是100%也不行。

 <table>
        <thead>
            <tr>
                <th>id</th>
                <th>国家</th>
            </tr>
        </thead>
        <tbody>
            <tr>
             <td>2272772</td>
             <td><div>房价</div><div>房价</div></td>
            </tr>
            <tr>
             <td>2272772</td>
             <td><div>房价</div><div>房价</div></td>
            </tr>
        </tbody>
    </table>

 

    table{border-collapse: collapse;}
    table th,table td{border:1px  solid #333;vertical-align: middle;width:150px;}
    table td div{border-bottom:1px  solid #333;width:100%;}
    table td div:last-child{border-bottom:none}

 

最后发现了table的一个属性cellspacing="0" cellpadding="0"。

把他加在table标签上就好了。

<table cellspacing="0" cellpadding="0">

  。。。。

</table>