如何在简单的Html代码中以下列格式显示表格

Question

我想使用简单的Html代码以表格格式显示图像内容。我该怎么做？

Answer 1

＆＃13;

＆＃13;

{{1}}

＆＃13;

{{1}}

＆＃13;

＆＃13;

＆＃13;

Answer 2

这是HTML表格中表格的极简主义代码：

这里有一些文档：https://www.w3schools.com/html/html_tables.asp

<table>
   <tr>
      <th></th>
      <th></th>
      <th></th>
      <th></th>      
   </tr>
   <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>      
   </tr>
</table>

Answer 3

这是一个解决方案。希望它可以帮到你

＆＃13;

＆＃13;

table {
  width: 45%;
  float: left;
}
table:nth-child(2) {
  margin-right: 5%;
}
table:before,
table:after {
  display: table-cell;
  content: ' ';
}
table:after {
  clear: both;
}
table td,
table p,
table span {
  white-space: nowrap;
  overflow: hidden;
}
table p {
  margin: 0px 10px 0px 0px;
  float: left;
}
table span {
  display: block;
  height: 14px;
  border-bottom: 1px dotted #000;
  overflow: hidden;
}

＆＃13;

<fieldset>
  <legend align="center">Standard deduction table</legend>
  <table>
    <tbody>
      <tr>
        <td><p>Single (cannot be claimed as dependent)</p><span></span></td>
        <td>$ 8,000</td>
      </tr>
      <tr>
        <td><p>Single (can be claimed as dependent)</p><span></span></td>
        <td>$ 3,100</td>
      </tr>
      <tr>
        <td><p>Head on household</p><span></span></td>
        <td>$ 11,200</td>
      </tr>
    </tbody>
  </table>
  <table>
    <tbody>
      <tr>
        <td><p>Qualifying widow(er)</p><span></span></td>
        <td>$ 16,050</td>
      </tr>
      <tr>
        <td><p>Married filling jointly</p><span></span></td>
        <td>$ 16,050</td>
      </tr>
      <tr>
        <td><p>Married filling seperate returns</p><span></span></td>
        <td>$ 8,000</td>
      </tr>
    </tbody>
  </table>
</fieldset>

＆＃13;

＆＃13;

＆＃13;

Answer 4

上面提到的是一组名称 - 值对。

因此，我认为您所拥有的内容在语义上最好标记为定义列表（<dl>） - 一系列数据标题（<dt>）伴随着相关的数据定义（<dd>）。

工作示例：

.standard-deduction-table {
width: 790px;
text-align: center;
}

h2 {
position: relative;
display: inline-block;
z-index: 12;
height: 21px;
padding: 0 6px;
line-height: 21px;
font-size: 14px;
font-family: arial, helvetica, sans-serif;
background-color: rgb(255, 255, 255);
}

dl {
display: block;
position: relative;
top: -37px;
width: 790px;
height: 64px;
padding: 24px 6px 12px;
border: 1px solid rgb(0,0,0);
}

dl::after {
content: '';
display: block;
clear: both;
}

dt {
position: relative;
float: left;
clear: both;
z-index: 12;
height: 20px;
margin: 0;
padding: 0 2px 0 0;
line-height: 20px;
background-color: rgb(255, 255, 255);
}

dd {
display: block;
position: relative;
left: 0;
text-align: right;
width: 370px;
height: 20px;
margin: 0;
padding: 0;
line-height: 20px;
}

dd::after {
content: '';
position: relative;
display: block;
bottom: 5px;
margin-right: 64px;
border-bottom: dotted 1px rgb(0, 0, 0);
}

dt:nth-of-type(n+4) {
position: relative;
top: -60px;
left: 420px;
}

dd:nth-of-type(n+4) {
position: relative;
top: -60px;
left: 420px;
}

<div class="standard-deduction-table">
<h2>Standard deduction table</h2>

<dl>
<dt>Single (cannot be claimed as a dependent)</dt>
<dd>&dollar;8,000</dd>
<dt>Single (can be claimed as a dependent)</dt>
<dd>&dollar;3,100</dd>
<dt>Head of Household</dt>
<dd>&dollar;11,200</dd>
<dt>Qualifying widower</dt>
<dd>&dollar;16,050</dd>
<dt>Married filing jointly</dt>
<dd>&dollar;16,050</dd>
<dt>Married filing separate returns</dt>
<dd>&dollar;8000</dd>
</dl>

</div>