如何布局看起来像纸质表单的aspx页面?

发布于 2024-11-19 02:45:17 字数 291 浏览 4 评论 0原文

我一直在开发桌面 aps,所以我的 aspx/html 有点生疏了。我需要做的是布局一个 aspx 页面,其字段看起来像这样(有很多字段,这只是一个抽象): LayoutExample 基本上,这些项目看起来像是在行中,但不是在独特的列中(例如,在我的示例中,街道名称不必与街道号码等对齐...)

我想实现与浏览器的最大兼容性 - 会是什么最适合这种情况使用?表格、列表项...div?还有别的东西吗?

我正在使用 aspx C# 4.0。

I've been developing desktop aps, so my aspx/html got a bit rusty. What I need to do is layout an aspx page with fields that look something like this (there are many fields, this is just an abstraction):
LayoutExample
Basically, the items look like they are in rows, but not in distinctive columns (e.g. in my example, street name doesn't have to allign with street number etc...)

I want to achieve maximum compatibility with browsers - what would be best to use for this scenario? Tables, list items... divs? something else?

I'm using aspx C# 4.0.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

苦笑流年记忆 2024-11-26 02:45:17

这是一个非表格示例:

http://jsfiddle.net/eRY8T/7/

传统观点是 table 应该用于以表格格式显示数据,而不是用于布局表单。

在实践中,我认为有时使用表格作为表单更容易 - 但这通常是当您的表单看起来像表格数据时(例如,一列用于标签,另一列用于输入)。

在你的情况下,我认为使用 div 实际上比表更容易。这可能需要大量的 rowspan/colspan/嵌套表才能正确。

与表格相比,使用基于 CSS 的布局的另一个优点是 Tab 键顺序可能更有意义。在示例中,请注意 tab 如何依次遍历第一列和第二列。在表中,它会在移动到下一行之前遍历给定行上的每个输入。

Here's a non-table example:

http://jsfiddle.net/eRY8T/7/

The conventional wisdom is that table should be used for displaying data in tabular format, not for laying out forms.

In practice I think it is sometimes easier to use tables for forms - but this is typically when your form looks like tabular data (e.g. one column for labels, another for inputs).

In your situation, I think using divs is actually easier than tables would be. This would probably require lots of rowspan/colspan/nested tables to get right.

The other advantage of using a CSS based layout over tables is that the tab order will probably make more sense. In the example, notice how tab goes through the first column then the 2nd one. In a table it would go through every input on a given row before moving to the next row.

初与友歌 2024-11-26 02:45:17

4行7列的表格怎么样
并使用相应的 colspan 来更好地对齐。

How about Table with 4 Rows and 7 Columns
and use corresponding colspan for better alignment.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文