今儿自己在做项目时,用到了table布局。
但是设计给的是每行有底边框。这个给难到自己了,后来自己搜索解决了。
<table>
<tr>
<td>
<p>奖池金额:</p>
</td>
<td>
<p>25000*2=<span>50000</span></p>
</td>
</tr>
<tr>
<td>
<p>中奖份数:</p>
</td>
<td>
<p>700</p>
</td>
</tr>
<tr>
<td>
<p>每份奖金:</p>
</td>
<td>
<p>50000 / 700 = 71.43</p>
</td>
</tr>
</table>
当我们要给table中的tr设置样式,要是单纯的在css中这样写。
tr{
border-bootom:1px solid #e5e5e5;
}
这样是不生效的!!!
这样是不生效的!!!
这样是不生效的!!!
想要样式生效必须这么写。。。
table{
border-collapse: collapse;
}
table tr{
border-bottom: 1px solid #e5e5e5;
}
必须给table设置border-collapse: collapse; 这个属性,tr的属性才会生效。。。