如何获取html表中分隔行中的元素？

Question

嘿，我正在从 excel 文件中获取数据，但所有数据都只返回一个行框中，这是我的 html 代码

{% block body %}

# i am using bootstrap table class
    <table class="table table-bordered">
        <thead>
            <tr>
              <th scope="col">Pensioner name</th>
              <th scope="col">cnic</th>
              <th scope="col">mobile</th>
              <th scope="col">wallet</th>


            </tr>
          </thead>

            <tr>
                {% if 'm1' %}
                <td><h6 >{{ m1 }}</h6></td>
                {% endif %}

                {% if 'm2' %}
                <td><h6 >{{ m2 }}</h6></td>
                {% endif %}
                {% if 'm3' %}
                <td><h6 >{{ m3 }}</h6></td>
                {% endif %}
                {% if 'm4' %}
                <td><h6 >{{ m4 }}</h6></td>
                {% endif %}
          </tr>
    </table>
{% endblock %}

这是我的输出enter image description here

我想把数据放到单独的行框中，现在看起来很乱，请帮忙

Answer 1

要创建新行，您需要为每一行添加一个新的 <tr> 元素。

这是一个工作示例

table,
tr,
th,
td {
  border: solid 1px;
}

<table>
  <thead>
    <tr>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Job Title</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>James</td>
      <td>Matman</td>
      <td>Chief Sandwich Eater</td>
    </tr>
    <tr>
      <td>The</td>
      <td>Tick</td>
      <td>Crimefighter Sorta</td>
    </tr>
  </tbody>
</table>

<tbody> 元素内的每个 <tr> 元素都会创建一个新行。