0

一个DNN模块由几个表单组成，其中文本字段、标签和日期选择器使用'tr'和'td' html 标签排列。后来，有人告诉我将这些表转换为无序列表，'ul'和'li'这样做会大大改善 UI 渲染体验吗？

我已经仔细阅读了以下文档，但仍有疑问：Tables vs. Unordered Lists。

4

4 回答 4

2
  1. 在呈现具有二维信息的数据时，表格很有用。
  2. 无序列表在呈现具有单维信息的数据时很有用。

以上是文章中值得考虑的几点

请记住，浏览器在嵌套数据方面存在问题，这里是表格。所以列表肯定会提高性能

于 2012-08-24T11:15:37.000 回答
2

就用户而言，这样做与 UI 渲染体验无关。

这个想法是将标记与表示分开。您标记表单并使用 CSS 来呈现它。

表格应该留给表格数据。

注意：浏览器在处理非常大且高度嵌套的表格时确实存在性能问题，这是在 CSS 存在之前布局任何内容的唯一方法。然而，由于 CSS 确实存在，它应该用于表示而不是 HTML 表格。

于 2012-08-24T11:10:07.823 回答
1

听起来好像您正在布置一个表单（“文本字段、标签和日期选择器”），在这种情况下，您最好使用 DIV、P、SPAN 和 LABEL 标签来组织您的控件，而不是 TABLE 标签或列表.

正如 Oded 所说，它不会对 UI 渲染产生太大影响，但最好为表格数据保留表格，我要补充一点，有序或无序的列表最好保存在列表中的数据 :)

如果您正在布置表单控件，我认为此讨论可能与您的决定更相关： http: //css-discuss.incutio.com/wiki/Tables_Vs_Divs

冒着真正引发争论的风险，我对 Asp.Net 表单中一行的首选布局是这样的：

<p class="form-line"> <!-- You could as well use a <div> -->
    <label>Field Name:</label>
    <asp:YOUR_CONTROL_HERE/>
    <asp:YOUR_VALIDATION_CONTROL_HERE/>
</p>
于 2012-08-24T11:11:47.723 回答
0

@JcFx - 实际上并非如此！

<div style="width: 100%; margin-top: 10px">
        <div style="float: left; display: inline-block; width: 50%" class="div1">
            <div style="float: left; display: inline-block; width: 25%" class="div2">
                <ul>
                    <li class="list1">
                        <asp:Label ID="lblPrefix" runat="server" Text='Prefix'></asp:Label>
                    </li>

等等。

于 2012-08-24T11:49:12.977 回答