Html 这些数据应该组织成一个表还是一系列div?

Html 这些数据应该组织成一个表还是一系列div?,html,django,Html,Django,最近,在工作中,对于如何最好地呈现一点数据进行了一些讨论,对于某些页面是否应该使用表来显示信息与使用引导创建psuedo表,似乎存在一些内部冲突 如果我们决定继续使用表来显示信息,这就是源代码的样子。一些有条件的废话已经被删除 <table class="table well"> <thead> <th> Name </th> <th> Detail #1 </th> <th

最近,在工作中,对于如何最好地呈现一点数据进行了一些讨论,对于某些页面是否应该使用表来显示信息与使用引导创建psuedo表,似乎存在一些内部冲突

如果我们决定继续使用表来显示信息,这就是源代码的样子。一些有条件的废话已经被删除

  <table class="table well">
  <thead>
      <th> Name </th>
      <th> Detail #1 </th>
      <th> Detail #2 </th>
      <th> Detail #3 </th>
  </thead>
  <tbody class="sortable">
  {% for m in model_list %}
      <tr id="{{ m.id }}">

          <td><span class='number-style'> {{ forloop.counter }}.</td>
          <td>{{ m.name}}</td>
          <td>{% autoescape off %}{{ m.detail1 }}{% endautoescape %} </td>
          <td>{% autoescape off %}{{ m.detail2}}{% endautoescape %} </td>
          <td>{% autoescape off %}{{ m.detail3}}{% endautoescape %} </td>
        </tr>
    {% endfor %}
  </tbody>

名称
细节#1
细节#2
细节#3
{m在模型_列表%中的百分比}
{{forloop.counter}}。
{{m.name}}
{%autoescape off%}{{m.detail1}{%endautoescape%}
{%autoescape off%}{{m.detail2}{%endautoescape%}
{%autoescape off%}{{m.detail3}{%endautoescape%}
{%endfor%}

这是使用引导div实现的

{% for m in model_list %}
<div class="row">
    <div class="span2">
    {{ m.name }}
    </div>

    <div class="span2" style="word-wrap: break-word">
        {% autoescape off %}{{ m.details1 }}{% endautoescape %}
    </div>

    <div class="span2" style="word-wrap: break-word">
        {% autoescape off %}{{ m.details2 }}{% endautoescape %}
    </div>

    <div class="span2" style="word-wrap: break-word">
        {% autoescape off %}{{ m.details3 }}{% endautoescape %}
    </div>

</div>
{% endfor %}
{model_list%中m的%
{{m.name}}
{%autoescape off%}{{m.details1}{%endautoescape%}
{%autoescape off%}{{m.details2}{%endautoescape%}
{%autoescape off%}{{m.details3}{%endautoescape%}
{%endfor%}

请记住,这两个表都包含在使用引导程序布局的页面中,它们可能是页面上每个“表”的多个实例。一般来说,哪种方法更可取?

对于细节1,每一行是否都具有相同的数据类型?细节2和3也是如此? 如果行之间的关系是所有行都有3个详细信息,但这3个详细信息可以是各种类型,而不是类型1、类型2和类型3,那么使用table不是正确的方法

例如,如果我列出书籍,并且它们的详细信息是固定的,并且类型是[作者、类别、成本],那么我肯定会使用一个表

但如果对于我列出的某些书籍[作者、类别、成本],对于某些我列出的书籍[作者、出版商、版本],而对于其他书籍则是完全不同的一套,那么表格并不是正确的方式。表格不应用于视觉样式和安排


看到你的代码,我强烈感觉到细节是相同的数据类型,因此应该在表格中显示。

s正是你使用它们的目的-表格数据。办公室内部似乎对表格数据的确切定义存在一些分歧。这是你可以在Excel中显示的吗电子表格还是Access数据库?然后是表格数据,每个表格的数据类型在技术上是相同的。它们将是客户端指定的文本块。例如,{m.name}}将是要执行的任务。{m.detail[1,2,3]}将是该任务的3个指令块。我不知道为什么会这样组织,但这正是我们的客户要求的。类似于第一步、第二步和第三步的任务?这似乎不是表格形式的数据。如果每个任务都是独立的,并且它们的指令对它们来说是唯一的,我认为如果这些行被分开并放在div中会更好。我应该指出,我知道有一种更干净、更漂亮的方式来安排这些任务。但是客户端希望用户能够使用它一次查看整个任务列表和相关的指令(如果可能的话,不要滚动)啊,据我所知,它们不一定是步骤。也许可以把它们看作是任务中需要牢记的东西。(对不起,我说得很模糊,但我尽量避开细节)除非用户应该根据他们必须“记住”的内容来比较任务,否则请使用div。我想即使是在其他情况下也要使用div。这显然不是表格数据。您试图实现的是表格数据的外观。使用div而不是表来执行此操作。