我已经创建了一个表格,但是在手机和平板电脑上,用白色线条分隔了每个td。有什么解决方案可以在不重构整个表的情况下删除它们?
我尝试了很多其他与我的问题很接近的解决方案。例如,border =“ 0”或“ 1”,border-collpase(已应用)等。 较粗的白线就可以了,只是每吨中的小条
.table {
display: table;
background: #fff;
width: 100%;
margin-top: 10px;
border: 1px solid #fff;
border-width: 30px 10px 10px 0px;
/* padding: 15px 15px 15px 5px; */
border-collapse: collapse;
}
.spacer{
display: none;
}
table .tr-border td {
border-bottom: 1px solid #0456A1;
}
table .tr-border-top{
border-top: 1px solid #0456A1;
}
table .tr-border .line-break{
border-bottom: 1px solid #fff;
}
.line-break-2{
border-bottom: 1px solid #0456A1;
}
.table-head-text {
font-size: 14px;
width: 3%;
color: #0d56a4;
text-transform: uppercase;
font-family: "UniversLTStd-BoldCn";
}
td {
border: none;
color: #5b5a5a;
font-size: 14px;
padding: 5px 0px 0px 15px;
font-family: "UniversLTStd-LightCn";
}
/*.left-td{
padding: 5px 0px 5px 25px;
}*/
.bk {
background: #d0d2d3;
padding-top: 10px;
padding-bottom: 10px;
}
.bottom-table-text{
position: relative;
top: 3px;
}
.table-year-1 {
background: #0d56a4;
color: #d0d2d3;
padding-right: 8px;
font-size: 16px;
width: 1%;
text-align: right;
font-family: "UniversLTStd-Cn";
}
span.loss-span {
display: block;
}
.table-year-2 {
background: #5b5a5a;
color: #d0d2d3;
font-size: 16px;
width: 1%;
text-align: right;
padding-right: 8px;
font-family: "UniversLTStd-Cn";
}
.bottom-number{
padding-top: 60px;
}
.bottom-number-2{
padding-top:25px;
}
.bottom-number-3{
padding-top: 20px;
font-family: "UniversLTStd-Cn";
font-weight: bold;
color: #fff;
padding-bottom: 10px;
}
.left-td-3{
padding-top: 15px;
}
.top-year-text{
padding-top:15px;
}
.block-text{
padding-top: 10px;
}
.bold{
font-family: "UniversLTStd-Cn";
font-weight: bold;
color: #fff;
padding-bottom: 10px;
padding-top: 10px;
letter-spacing: 1px;
}
.border {
border-bottom: 1px solid #0456A1;
}
<table class="table">
<tbody>
<tr>
<td class="table-head-text top-table-text left-td-2">Assets</td>
<td class="table-year-1 bold top-year-text">2018</td>
<td class="spacer"> </td>
<td class="table-year-2 bold top-year-text">2017</td>
</tr>
<tr>
<td class="left-td left-td-2">Cash & Due From Banks</td>
<td class="table-year-1">$149,753</td>
<td class="spacer"> </td>
<td class="table-year-2">$77,515</td>
</tr>
<tr>
<td class="left-td left-td-2">Investment Securities</td>
<td class="table-year-1">$929,432</td>
<td class="spacer"> </td>
<td class="table-year-2">$830,878</td>
</tr>
<tr>
<td class="left-td left-td-2">Loans <span class="soc-head-text-1">(net of valuation reserve)</span> <span class="soc-head-text-2">($28,582 in 2018 & <span class="soc-head-text-1">$27,063 in 2017)</span></span>
</td>
<td class="table-year-1 bottom-number">$1,902,960</td>
<td class="spacer"> </td>
<td class="table-year-2 bottom-number">$1,813,062</td>
</tr>
<tr>
<td class="left-td left-td-2">Federal Funds Sold</td>
<td class="table-year-1">$0</td>
<td class="spacer"> </td>
<td class="table-year-2">$0</td>
</tr>
<tr>
<td class="left-td left-td-2">Premises & Equipment</td>
<td class="table-year-1">$49,956</td>
<td class="spacer"> </td>
<td class="table-year-2">$46,666</td>
</tr>
<tr>
<td class="left-td left-td-2">Accured Income</td>
<td class="table-year-1">$12,652</td>
<td class="spacer"> </td>
<td class="table-year-2">$12,589</td>
</tr>
<tr>
<td class="left-td left-td-2">Other Assets</td>
<td class="table-year-1">$111,287</td>
<td class="spacer"> </td>
<td class="table-year-2">$102,413</td>
</tr>
<tr class="tr-border">
<td class="table-head-text left-td-2">Total Assets</td>
<td class="table-year-1 bold line-break">$3,156,040</td>
<td class="spacer"> </td>
<td class="table-year-2 bold line-break">$2,883,123</td>
</tr>
<tr>
<td class="table-head-text top-table-text left-td-3">Liabilities & <span class="soc-head-text-1">Capital Funds</span></td>
<td class="table-year-1"> </td>
<td class="spacer"> </td>
<td class="table-year-2"> </td>
</tr>
<tr>
<td class="left-td left-td-2">Non-Interest Bearing <span class="soc-head-text-1">Deposits</span></td>
<td class="table-year-1">$952,623</td>
<td class="spacer"> </td>
<td class="table-year-2">$894,075</td>
</tr>
<tr>
<td class="left-td left-td-2">Non-Interest Bearing <span class="soc-head-text-1">Public Deposits</span></td>
<td class="table-year-1 bottom-number-2">$190,104</td>
<td class="spacer"> </td>
<td class="table-year-2 bottom-number-2">$179,582</td>
</tr>
<tr>
<td class="left-td left-td-2">Interest Bearing Deposits</td>
<td class="table-year-1">$1,344,490</td>
<td class="spacer"> </td>
<td class="table-year-2">$1,194,226</td>
</tr>
<tr>
<td class="left-td left-td-2">Interest Bearing <span class="soc-head-text-1">Public Deposits</span></td>
<td class="table-year-1 bottom-number-2">$370,094</td>
<td class="spacer"> </td>
<td class="table-year-2 bottom-number-2">$274,994</td>
</tr>
<tr class="tr-border">
<td class="table-head-text left-td-2">Total Deposits</td>
<td class="table-year-1 bold line-break">$2,857,311</td>
<td class="spacer"> </td>
<td class="table-year-2 bold line-break">$2,542,877</td>
</tr>
<tr>
<td class="block-text left-td left-td-2">Other Liabilities</td>
<td class="table-year-1 block-text">$22,497</td>
<td class="spacer"> </td>
<td class="table-year-2 block-text">$22,954</td>
</tr>
<tr>
<td class="left-td left-td-2">Fed Funds Purchase & <span class="soc-head-text-1">Other Borrowed Money</span></td>
<td class="table-year-1 bottom-number-2">$0</td>
<td class="spacer"> </td>
<td class="table-year-2 bottom-number-2">$63,394</td>
</tr>
<tr class="tr-border">
<td class="table-head-text left-td left-td-2">Total Liabilities</td>
<td class="table-year-1 bold line-break">$2,879,808</td>
<td class="spacer"> </td>
<td class="table-year-2 bold line-break">$2,629,225</td>
</tr>
<tr>
<td class="table-head-text top-table-text left-td-3">Capital Accounts</td>
<td class="table-year-1"> </td>
<td class="spacer"> </td>
<td class="table-year-2"> </td>
</tr>
<tr>
<td class="left-td left-td-2">Capital Stock</td>
<td class="table-year-1">$2,500</td>
<td class="spacer"> </td>
<td class="table-year-2">$2,500</td>
</tr>
<tr>
<td class="left-td left-td-2">Surplus</td>
<td class="table-year-1">$100,943</td>
<td class="spacer"> </td>
<td class="table-year-2">$79,188</td>
</tr>
<tr>
<td class="left-td left-td-2">Undivided Profits</td>
<td class="table-year-1">$188,173</td>
<td class="spacer"> </td>
<td class="table-year-2">$177,768</td>
</tr>
<tr>
<td class="left-td left-td-2">Unrealized Gain <span class="loss-span"><span class="soc-head-text-1">(Loss) Securities</span></span>
</td>
<td class="table-year-1 bottom-number-2">($15,384)</td>
<td class="spacer"> </td>
<td class="table-year-2 bottom-number-2">($5,558)</td>
</tr>
<tr class="tr-border">
<td class="table-head-text left-td-2 left-td-4">Total Capital Accounts</td>
<td class="table-year-1 line-break bottom-number-3">$276,232</td>
<td class="spacer"> </td>
<td class="table-year-2 line-break bottom-number-3">$253,898</td>
</tr>
<tr>
<td class="table-head-text bk"><span class="bottom-table-text">Total Liabilities & <span class="soc-head-text-1">Capital Accounts</span></span>
</td>
<td class="table-year-1 line-break-2 bottom-number-3">$3,156,040</td>
<td class="spacer"> </td>
<td class="table-year-2 line-break-2 bottom-number-3">$2,883,123</td>
</tr>
<tr class="tr-border-top">
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
答案 0 :(得分:0)
尝试将outline
的{{1}}和border
属性设置为none
。
td
答案 1 :(得分:0)
您尝试使用
边界崩溃:分开;
在.table中?