HTML 表列标题中没有分割线，为什么？

问题描述 投票：0回答：1

我正在为我的网站使用 WordPress。

我为 table、tr、td 等元素设置 CSS，以便显示单元格行。但是，最终结果显示所有其他单元格行都正常，除了列标题。列标题合并为一个部分，没有任何分隔符。为什么？

添加边框的CSS规则是：

table {
    border: 1px solid #ddd;
}
table td {
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

table td:first-child {
    border-left: 0;
}

table tr:last-child td {
    border-bottom: 0;
}


table {
  border-collapse: separate;
  border-spacing: 0;
  margin: 2.5em 0;
  width: 100%;
  border-width: 0;
  border-style: solid;
  border-color: #eee;
}

table {
  border: 1px solid #ddd;
}

tbody {
  display: table-row-group;
  vertical-align: middle;
  border-color: inherit;
}

tr {
  display: table-row;
  vertical-align: inherit;
  border-color: inherit;
}

table {
  border: 1px solid #ddd;
}

table td {
  border-left: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}

table td:first-child {
  border-left: 0;
}

table tr:last-child td {
  border-bottom: 0;
}
<table class="responsive">
  <tbody>
    <tr>
      <th>Product</th>
      <th>File</th>
      <th>Size</th>
      <th>Download</th>
    </tr>
    <tr>
      <td>DataNumen Access Repair 4.1</td>
      <td>daccr.exe</td>
      <td>9.52MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/access-repair-download-thanks" href="https://download.datanumen.com/downloads/file/daccr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Excel Repair 3.9</td>
      <td>dexcelr.exe</td>
      <td>8.57MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/excel-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dexcelr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Word Repair 4.5</td>
      <td>dwordr.exe</td>
      <td>8.81MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/word-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dwordr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen PowerPoint Recovery 2.2</td>
      <td>dpptr.exe</td>
      <td>8.63MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/powerpoint-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/dpptr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Outlook Repair 8.8</td>
      <td>dolkr.exe</td>
      <td>12.5MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/outlook-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dolkr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Outlook Express Repair 2.5</td>
      <td>doer.exe</td>
      <td>6.18MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/outlook-express-repair-download-thanks" href="https://download.datanumen.com/downloads/file/doer.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Outlook Express Undelete 2.2</td>
      <td>doeu.exe</td>
      <td>1.66MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/outlook-express-undelete-download-thanks" href="https://download.datanumen.com/downloads/file/doeu.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Outlook Express Drive Recovery 1.0</td>
      <td>doedr.exe</td>
      <td>1.27MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/outlook-express-drive-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/doedr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Exchange Recovery 8.8</td>
      <td>dexr.exe</td>
      <td>12.3MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/exchange-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/dexr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Outlook Drive Recovery 8.8</td>
      <td>dodr.exe</td>
      <td>11.2MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/outlook-drive-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/dodr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Outlook Password Recovery 1.2</td>
      <td>dopr.exe</td>
      <td>6.51MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/outlook-password-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/dopr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen BKF Repair 3.6</td>
      <td>dbkfr.exe</td>
      <td>7.84MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/bkf-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dbkfr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Zip Repair 3.7</td>
      <td>dzipr.exe</td>
      <td>8.03MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/zip-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dzipr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen TAR Repair 3.0</td>
      <td>dtar.exe</td>
      <td>7.61MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/tar-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dtar.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen CAB Repair 2.4</td>
      <td>dcabr.exe</td>
      <td>6.44MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/cab-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dcabr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen RAR Repair 3.7</td>
      <td>drar.exe</td>
      <td>7.89MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/rar-repair-download-thanks" href="https://download.datanumen.com/downloads/file/drar.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen SQL Recovery 6.3</td>
      <td>dsr.exe</td>
      <td>8.09MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/sql-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/dsr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen DBF Repair 3.1</td>
      <td>ddbfr.exe</td>
      <td>7.78MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/dbf-repair-download-thanks" href="https://download.datanumen.com/downloads/file/ddbfr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Oracle Recovery 1.0</td>
      <td>dorcr.exe</td>
      <td>1.49MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/oracle-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/dorcr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen PDF Repair 3.2</td>
      <td>dpdfr.exe</td>
      <td>8.46MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/pdf-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dpdfr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen DWG Recovery 3.2</td>
      <td>ddwgr.exe</td>
      <td>60.7MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/dwg-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/ddwgr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen PSD Repair 3.1</td>
      <td>dpsdr.exe</td>
      <td>7.97MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/psd-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dpsdr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Data Recovery 2.4</td>
      <td>ddr.exe</td>
      <td>11.2MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/data-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/ddr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen NTFS Undelete 2.0</td>
      <td>dntu.exe</td>
      <td>1.46MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/ntfs-undelete-download-thanks" href="https://download.datanumen.com/downloads/file/dntu.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Office Repair 5.7</td>
      <td>dofr.exe</td>
      <td>27.8MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/office-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dofr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Database Recovery 2.7</td>
      <td>ddbr.exe</td>
      <td>11MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/database-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/ddbr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Archive Repair 3.8</td>
      <td>darcr.exe</td>
      <td>16.3MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/archive-repair-download-thanks" href="https://download.datanumen.com/downloads/file/darcr.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Disk Image 2.2</td>
      <td>ddki.exe</td>
      <td>5.79MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/disk-image-download-thanks" href="https://download.datanumen.com/downloads/file/ddki.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen Backup 1.7</td>
      <td>dbkup.exe</td>
      <td>6.54MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/backup-download-thanks" href="https://download.datanumen.com/downloads/file/dbkup.exe" class="download-url"> Download</a></td>
    </tr>
    <tr>
      <td>DataNumen File Splitter 1.2</td>
      <td>dfsp.exe</td>
      <td>5.12MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
<use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
</svg><a download-link="https://www.datanumen.com/file-splitter-download-thanks" href="https://download.datanumen.com/downloads/file/dfsp.exe" class="download-url"> Download</a></td>
    </tr>
  </tbody>
</table>

html css header border
1个回答
0
投票

错过：

    table th {
        border-left: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
}


table {
    border: 1px solid #ddd;
}
table td {
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

table td:first-child {
    border-left: 0;
}

table tr:last-child td {
    border-bottom: 0;
}

table {
    border-collapse: separate;
    border-spacing: 0;
    margin: 2.5em 0;
    width: 100%;
    border-width: 0;
    border-style: solid;
    border-color: #eee;
}

table {
    border: 1px solid #ddd;
}

tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
}

tr {
    display: table-row;
    vertical-align: inherit;
    border-color: inherit;
}

table {
    border: 1px solid #ddd;
}
table td {
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
table th {
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

table td:first-child {
    border-left: 0;
}

table tr:last-child td {
    border-bottom: 0;
}
<table class="responsive">
  <thead>
    <tr>
      <th>Product</th>
      <th>File</th>
      <th>Size</th>
      <th>Download</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>DataNumen Access Repair 4.1</td>
      <td>daccr.exe</td>
      <td>9.52MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
          <use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
        </svg><a download-link="https://www.datanumen.com/access-repair-download-thanks" href="https://download.datanumen.com/downloads/file/daccr.exe" class="download-url"> Download</a>
      </td>
    </tr>
    <tr>
      <td>DataNumen Excel Repair 3.9</td>
      <td>dexcelr.exe</td>
      <td>8.57MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
          <use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
        </svg><a download-link="https://www.datanumen.com/excel-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dexcelr.exe" class="download-url"> Download</a>
      </td>
    </tr>
    <tr>
      <td>DataNumen Word Repair 4.5</td>
      <td>dwordr.exe</td>
      <td>8.81MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
          <use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
        </svg><a download-link="https://www.datanumen.com/word-repair-download-thanks" href="https://download.datanumen.com/downloads/file/dwordr.exe" class="download-url"> Download</a>
      </td>
    </tr>
    <tr>
      <td>DataNumen PowerPoint Recovery 2.2</td>
      <td>dpptr.exe</td>
      <td>8.63MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
          <use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons/icons.svg#cloud-download-alt"></use>
        </svg><a download-link="https://www.datanumen.com/powerpoint-recovery-download-thanks" href="https://download.datanumen.com/downloads/file/dpptr.exe" class="download-url"> Download</a>
      </td>
    </tr>
    <tr>
      <td>DataNumen Outlook Repair 8.8</td>
      <td>dolkr.exe</td>
      <td>12.5MB</td>
      <td>
        <svg class="my-svg-inline--fa my-fa-w-20">
          <use href="https://www.datanumen.com/wp-content/themes/datanumen/images/icons

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.