表标题中的单元格间距

时间:2020-09-09 06:42:40

标签: html css

我想删除单元格之间的白色间距,如下所示,并且“总计”实际上并不是表格的中心。如何居中对齐以便与其他字段保持一致

enter image description here

请查看所使用的代码。

<p><br>
<table border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td style="width: 300px; border-bottom: solid windowtext 1.0pt; border-right: solid windowtext 1.0pt; border-left: solid windowtext 1.0pt; border-top: solid windowtext 1.0pt;  background: #D9D9D9; text-align: center;">
            <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">Hardware</span></p>
        </td>
        <td style="width: 200px; border-bottom: solid windowtext 1.0pt; border-right: solid windowtext 1.0pt; border-left: solid windowtext 1.0pt; border-top: solid windowtext 1.0pt;  background: #D9D9D9; text-align: center;">
           <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">QTY</span></p>
        </td>
        <td style="width: 200px;  border-bottom: solid windowtext 1.0pt; border-right: solid windowtext 1.0pt; border-left: solid windowtext 1.0pt; border-top: solid windowtext 1.0pt;  background: #D9D9D9; text-align: center;">
           <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">Price</span></p>
        </td>
        <td style="width: 200px;  border-bottom: solid windowtext 1.0pt; border-right: solid windowtext 1.0pt; border-left: solid windowtext 1.0pt; border-top: solid windowtext 1.0pt;  background: #D9D9D9; text-align: center;">
           <p><span style="font-family:'Arial',sans-serif; font-weight: normal;">Total</span></p>
        </td>
    </tr>
<br>

    <tr>
        <td style="width: 300px; border-left: solid windowtext 1.0pt;  text-align: center;border-top: none; border-bottom: solid windowtext 1.0pt; border-right: none;">
            <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">Engineering Desktop</span></p>
        </td>
        <td style="width: 200px;  text-align: center;border-top: none; border-left: none; border-bottom: solid windowtext 1.0pt; border-right: none;">
           <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">3</span></p>
        </td>
        <td style="width: 200px;  text-align: center;border-top: none; border-left: none; border-bottom: solid windowtext 1.0pt; border-right: none;">
           <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">503.00 </span></p>
        </td>
        <td style="width: 200px; border-bottom: solid windowtext 1.0pt; text-align: center;border-top: none; border-left: none; border-bottom: solid windowtext 1.0pt; border-right: solid windowtext 1.0pt; ">
           <p><span style="font-family:'Arial',sans-serif; font-weight: normal;">1509</span></p>
        </td>
    </tr>

    <tr>
        <td style="width: 300px; border-left: solid windowtext 1.0pt;  text-align: center;border-top: none; border-bottom: solid windowtext 1.0pt; border-right: none;">
            <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">BIM-Spec Desktop</span></p>
        </td>
        <td style="width: 200px;  text-align: center;border-top: none; border-left: none; border-bottom: solid windowtext 1.0pt; border-right: none;">
           <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">1</span></p>
        </td>
        <td style="width: 200px;  text-align: center;border-top: none; border-left: none; border-bottom: solid windowtext 1.0pt; border-right: none;">
           <p><span style="font-family: 'Arial',sans-serif; font-weight: normal;">765.00 </span></p>
        </td>
        <td style="width: 200px; border-bottom: solid windowtext 1.0pt; text-align: center;border-top: none; border-left: none; border-bottom: solid windowtext 1.0pt; border-right: solid windowtext 1.0pt; ">
           <p><span style="font-family:'Arial',sans-serif; font-weight: normal;">765</span></p>
        </td>
    </tr>
</table></p>

1 个答案:

答案 0 :(得分:0)

在表中添加 border-collapse:collapse; 属性

结果:

enter image description here

package com.test.dal;

import java.util.Arrays;
import java.util.List;
import java.util.Map;
import java.util.stream.Collectors;

public class LTest {

    public static void main(String[] args) {
        List<String[]> values = getResultList();
        //values = [obj1,obj2,obj3]
        //obj1 = "1", "01";
        //obj2 = "1", "02";
        //obj3 = "1:, "03";

        Map<String, List<String>> resultMap = values.stream().collect(Collectors.groupingBy(o -> ((String[]) o)[0], Collectors.mapping(o -> ((String[]) o)[1], Collectors.toList())));
        System.out.println(resultMap);
    }

    public static List<String[]> getResultList() {
        String[][] inits = {
                {
                        "1", "01"
                }, {
                "1", "02"
        }, {
                "1", "03"
        }
        };
        List<String[]> tbList = Arrays.asList(inits);
        return tbList;
    }
}
table{
  border-collapse:collapse;
}