为什么不在 HTML 中使用表格进行布局？

Why not use tables for layout in HTML?

提问by Benno Richters

It seems to be the general opinionthat tables should not be used for layout in HTML.

似乎普遍认为表格不应该用于 HTML 中的布局。

Why?

为什么？

I have never (or rarely to be honest) seen good arguments for this. The usual answers are:

我从来没有（或说实话很少）看到这方面的好论据。通常的答案是：

• It's good to separate content from layout
  But this is a fallacious argument; Cliche Thinking. I guess it's true that using the table element for layout has little to do with tabular data. So what? Does my boss care? Do my users care?
  
  Perhaps me or my fellow developers who have to maintain a web page care... Is a table less maintainable? I think using a table is easierthan using divs and CSS.
  
  By the way... why is using a div or a span good separation of content from layout and a table not? Getting a good layout with only divs often requires a lot of nested divs.

• Readability of the code
  I think it's the other way around. Most people understand HTML, few understand CSS.

• It's better for SEO not to use tables
  Why? Can anybody show some evidence that it is? Or a statement from Google that tables are discouraged from an SEO perspective?

• Tables are slower.
  An extra tbody element has to be inserted. This is peanuts for modern web browsers. Show me some benchmarks where the use of a table significantly slows down a page.

• A layout overhaul is easier without tables, see css Zen Garden.
  Most web sites that need an upgrade need new content (HTML) as well. Scenarios where a new version of a web site only needs a new CSS file are not very likely. Zen Garden is a nice web site, but a bit theoretical. Not to mention its misuseof CSS.

• 将内容与布局分开是好的，
  但这是一个错误的论点；陈词滥调。我想确实使用表格元素进行布局与表格数据几乎没有关系。所以呢？我的老板在乎吗？我的用户关心吗？
  
  也许我或我的开发人员必须维护网页关心......表格的可维护性较低吗？我认为使用表格比使用 div 和 CSS更容易。
  
  顺便说一句...为什么使用 div 或 span 不能很好地将内容与布局和表格分开？仅使用 div 获得良好的布局通常需要大量嵌套的 div。

• 代码的可读性
  我认为是相反的。大多数人了解 HTML，很少有人了解 CSS。

• SEO 最好不要使用表格
  为什么？有人能拿出一些证据证明它是吗？或者谷歌声明从 SEO 的角度不鼓励使用表格？

• 表比较慢。
  必须插入额外的 tbody 元素。这是现代网络浏览器的花生。向我展示一些基准测试，其中使用表格会显着减慢页面速度。

• 没有表格，布局大修更容易，请参阅css Zen Garden。
  大多数需要升级的网站也需要新内容 (HTML)。不太可能出现网站的新版本只需要一个新的 CSS 文件的情况。Zen Garden 是一个不错的网站，但有点理论化。更不用说它对CSS 的滥用了。

I am really interested in good arguments to use divs + CSS instead of tables.

我对使用 divs + CSS 而不是表格的好论据真的很感兴趣。

采纳答案by Konrad Rudolph

I'm going to go through your arguments one after another and try to show the errors in them.

我将一个接一个地你的论点，并试图指出其中的错误。

It's good to separate content from layout But this is a fallacious argument; Cliché Thinking.

将内容与布局分开是好的，但这是一个错误的论点；陈词滥调的思维。

It's not fallacious at all because HTML was designed intentionally. Misuse of an element might not be completely out of question (after all, new idioms have developed in other languages, as well) but possible negative implications have to be counterbalanced. Additionally, even if there were no arguments against misusing the <table>element today, there might be tomorrow because of the way browser vendors apply special treatment to the element. After all, they know that “<table>elements are for tabular data only” and might use this fact to improve the rendering engine, in the process subtly changing how <table>s behave, and thus breaking cases where it was previously misused.

这完全没有错，因为 HTML 是有意设计的。滥用某个元素可能并非完全没有问题（毕竟，其他语言中也出现了新的习语），但必须抵消可能产生的负面影响。此外，即使<table>今天没有反对滥用元素的论据，但由于浏览器供应商对元素应用特殊处理的方式，明天可能会有。毕竟，他们知道“<table>元素仅用于表格数据”，并且可能会利用这一事实来改进渲染引擎，在此过程中巧妙地改变<table>s 的行为方式，从而打破以前被滥用的情况。

So what? Does my boss care? Do my users care?

所以呢？我的老板在乎吗？我的用户关心吗？

Depends. Is your boss pointy-haired? Then he might not care. If she's competent, then she will care, because the users will.

要看。你的老板是尖头吗？那么他可能不在乎。如果她有能力，那么她会关心，因为用户会。

Perhaps me or my fellow developers who have to maintain a web page care... Is a table less maintainable? I think using a table is easier than using divs and css.

也许我或我的开发人员必须维护网页关心......表格的可维护性较低吗？我认为使用表格比使用 div 和 css 更容易。

The majority of professional web developers seem to oppose you^{[citation needed]}. That tables arein fact less maintainable should be obvious. Using tables for layout means that changing the corporate layout will in fact mean changing every single page. This can be veryexpensive. On the other hand, judicious use of semantically meaningful HTML combined with CSS mightconfine such changes to the CSS and the pictures used.

大多数专业 Web 开发人员似乎都反对您^{[需要引用]}。这表是实际上少维护的应该是显而易见的。使用表格进行布局意味着更改公司布局实际上意味着更改每一页。这可能非常昂贵。另一方面，明智地将语义上有意义的 HTML 与 CSS 结合使用可能会将此类更改限制在 CSS 和所使用的图片中。

By the way... why is using a div or a span good separation of content from layout and a table not? Getting a good layout with only divs often requires a lot of nested divs.

顺便说一句...为什么使用 div 或 span 不能很好地将内容与布局和表格分开？仅使用 div 获得良好的布局通常需要大量嵌套的 div。

Deeply nested <div>s are an anti-pattern just as table layouts. Good web designers don't need many of them. On the other hand, even such deep-nested divs don't have many of the problems of table layouts. In fact, they can even contribute to a semantic structure by logically dividing the content in parts.

深度嵌套的<div>s 是一种反模式，就像表格布局一样。优秀的网页设计师不需要很多。另一方面，即使是这种嵌套很深的 div 也不会有很多表格布局的问题。事实上，它们甚至可以通过逻辑地将内容分成几部分来形成语义结构。

Readability of the code I think it's the other way around. Most people understand html, little understand css. It's simpler.

代码的可读性我认为是相反的。大多数人了解html，很少了解css。它更简单。

“Most people” don't matter. Professionals matter. For professionals, table layouts create many more problems than HTML + CSS. This is like saying I shouldn't use GVim or Emacs because Notepad is simpler for most people. Or that I shouldn't use LaTeX because MS Word is simpler for most people.

“大多数人”并不重要。专业人士很重要。对于专业人士来说，表格布局比 HTML + CSS 产生的问题更多。这就像说我不应该使用 GVim 或 Emacs，因为记事本对大多数人来说更简单。或者我不应该使用 LaTeX，因为 MS Word 对大多数人来说更简单。

It's better for SEO not to use tables

SEO 最好不要使用表格

I don't know if this is true and wouldn't use this as an argument but it would be logical. Search engines search for relevantdata. While tabular data could of course be relevant, it's rarely what users search for. Users search for terms used in the page title or similarly prominent positions. It would therefore be logical to exclude tabular content from filtering and thus cutting the processing time (and costs!) by a large factor.

我不知道这是否属实，也不会将此用作论据，但这是合乎逻辑的。搜索引擎搜索相关数据。虽然表格数据当然可能是相关的，但用户搜索的内容很少。用户搜索页面标题或类似显着位置中使用的术语。因此，将表格内容排除在过滤之外是合乎逻辑的，从而大大减少处理时间（和成本！）。

Tables are slower. An extra tbody element has to be inserted. This is peanuts for modern web browsers.

表比较慢。必须插入额外的 tbody 元素。这是现代网络浏览器的花生。

The extra element has got nothing to do with tables being slower. On the other hand, the layout algorithm for tables is much harder, the browser often has to wait for the whole table to load before it can begin to layout the content. Additionally, caching of the layout won't work (CSS can easily be cached). All this has been mentioned before.

额外的元素与表格变慢无关。另一方面，表格的布局算法要困难得多，浏览器通常必须等待整个表格加载完毕才能开始布局内容。此外，布局的缓存将不起作用（CSS 可以轻松缓存）。这一切都在前面提到过。

Show me some benchmarks where the use of a table significantly slows down a page.

向我展示一些基准测试，其中使用表格会显着减慢页面速度。

Unfortunately, I don't have any benchmark data. I would be interested in it myself because it's right that this argument lacks a certain scientific rigour.

不幸的是，我没有任何基准数据。我自己也会对它感兴趣，因为这个论点缺乏一定的科学严谨性是对的。

Most web sites that need an upgrade need new content (html) as well. Scenarios where a new version of a web site only needs a new css file are not very likely.

大多数需要升级的网站也需要新内容 (html)。不太可能出现网站的新版本只需要一个新的 css 文件的情况。

Not at all. I've worked on several cases where changing the design was simplified by a separation of content and design. It's often still necessary to change some HTML code but the changes will always be much more confined. Additionally, design changes must on occasion be made dynamically. Consider template engines such as the one used by the WordPress blogging system. Table layouts would literally kill this system. I've worked on a similar case for a commercial software. Being able to change the design without changing the HTML code was one of the business requirements.

一点也不。我处理过几个案例，其中通过内容和设计的分离来简化设计的更改。通常仍然需要更改一些 HTML 代码，但更改将始终受到限制。此外，有时必须动态进行设计更改。考虑模板引擎，例如 WordPress 博客系统使用的模板引擎。表格布局真的会扼杀这个系统。我曾为商业软件处理过类似的案例。能够在不更改 HTML 代码的情况下更改设计是业务需求之一。

Another thing. Table layout makes automated parsing of websites (screen scraping) much harder. This might sound trivial because, after all, who does it? I was surprised myself. Screen scraping can help a lot if the service in question doesn't offer a WebService alternative to access its data. I'm working in bioinformatics where this is a sad reality. Modern web techniques and WebServices have not reached most developers and often, screen scraping is the only way to automate the process of getting data. No wonder that many biologists still perform such tasks manually. For thousands of data sets.

另一件事。表格布局使网站的自动解析（屏幕抓取）变得更加困难。这听起来可能微不足道，因为毕竟是谁做的？我自己也很惊讶。如果相关服务不提供 WebService 替代方案来访问其数据，则屏幕抓取会很有帮助。我在生物信息学工作，这是一个可悲的现实。现代 Web 技术和 Web 服务尚未普及到大多数开发人员，通常，屏幕抓取是自动化获取数据过程的唯一方法。难怪许多生物学家仍然手动执行此类任务。对于数以千计的数据集。

回答by Carl Camera

Here's my programmer's answerfrom a simliar thread

这是我的程序员在一个类似线程中的回答

Semantics 101

语义101

First take a look at this code and think about what's wrong here...

首先看看这段代码，想想这里有什么问题......

class car {
    int wheels = 4;
    string engine;
}

car mybike = new car();
mybike.wheels = 2;
mybike.engine = null;

The problem, of course, is that a bike is not a car. The car class is an inappropriate class for the bike instance. The code is error-free, but is semanticallyincorrect. It reflects poorly on the programmer.

当然，问题是自行车不是汽车。car 类对于自行车实例来说是一个不合适的类。代码没有错误，但在语义上是不正确的。它对程序员的反映很差。

Semantics 102

语义102

Now apply this to document markup. If your document needs to present tabular data, then the appropriate tag would be <table>. If you place navigation into a table however, then you're misusing the intended purpose of the <table>element. In the second case, you're not presenting tabular data -- you're (mis)using the <table>element to achieve a presentational goal.

现在将此应用于文档标记。如果您的文档需要呈现表格数据，那么合适的标签应该是<table>. 但是，如果您将导航置于表格中，那么您就滥用了<table>元素的预期用途。在第二种情况下，您没有展示表格数据——您（错误地）使用该<table>元素来实现展示目标。

Conclusion

结论

Will visitors notice? No. Does your boss care? Maybe. Do we sometimes cut corners as programmers? Sure. But should we? No. Who benefits if you use semantic markup? You -- and your professional reputation. Now go and do the right thing.

游客会注意到吗？不。你的老板在乎吗？也许。作为程序员，我们有时会偷工减料吗？当然。但我们应该吗？不。如果您使用语义标记，谁会受益？您 - 以及您的专业声誉。现在去做正确的事。

回答by erlando

Obvious answer: See CSS Zen Garden. If you tell me that you can easily do the same with a table-based layout (remember - the HTML isn't changing) then by all means use tables for layout.

显而易见的答案：请参阅CSS Zen Garden。如果你告诉我你可以很容易地使用基于表格的布局来做同样的事情（记住 - HTML 没有改变），那么一定要使用表格进行布局。

Two other important things are accessibility and SEO.

另外两个重要的事情是可访问性和 SEO。

Both care about in what order information is presented. You cannot easily present your navigation at the top of the page if your table-based layout puts it in the 3rd cell of the 2nd row of the 2nd nested table on the page.

两者都关心以何种顺序呈现信息。如果基于表格的布局将导航放在页面上第二个嵌套表格的第二行的第三个单元格中，则无法轻松地在页面顶部显示导航。

So your answers are maintainability, accessibility and SEO.

所以你的答案是可维护性、可访问性和 SEO。

Don't be lazy. Do things the right and proper way even if they are a bit harder to learn.

不要偷懒。以正确和正确的方式做事，即使它们有点难学。

回答by Joel Coehoorn

See this duplicate question.

看到这个重复的问题。

One item you're forgetting there is accessibility. Table-based layouts don't translate as well if you need to use a screen reader, for example. And if you do work for the government, supporting accessible browsers like screen readers may be required.

您忘记的一项是可访问性。例如，如果您需要使用屏幕阅读器，则基于表格的布局也不会翻译。如果您确实为政府工作，则可能需要支持可访问的浏览器，例如屏幕阅读器。

I also think you underestimate the impact of some of the things you mentioned in the question. For example, if you are both the designer and the programmer, you may not have a full appreciation of how well it separates presentation from content. But once you get into a shop where they are two distinct roles the advantages start to become clearer.

我还认为你低估了你在问题中提到的一些事情的影响。例如，如果您既是设计师又是程序员，您可能无法完全理解它如何将演示与内容分开。但是，一旦您进入一家他们是两个不同角色的商店，优势就会开始变得更加清晰。

If you know what you're doing and have good tools, CSS really does have significant advantages over tables for layout. And while each item by itself may not justify abandoning tables, taken together it's generally worth it.

如果您知道自己在做什么并且拥有良好的工具，那么 CSS 确实比表格在布局方面具有显着优势。虽然每个项目本身可能不能成为放弃桌子的理由，但总的来说，它是值得的。

回答by James Curran

Unfortunately, CSS Zen Garden can no longer be used as an example of good HTML/CSS design. Virtually all of their recent designs use graphics for section heading. These graphic files are specified in the CSS.

不幸的是，CSS Zen Garden 不能再作为优秀的 HTML/CSS 设计的例子。事实上，他们最近的所有设计都使用图形作为章节标题。这些图形文件在 CSS 中指定。

Hence, a website whose purpose is to show the advantage of keeping design out of content, now regularly commits the UNSPEAKABLE SIN of putting content into design. (If the section heading in the HTML file were to change, the section heading displayed would not).

因此，一个旨在展示将设计置于内容之外的优势的网站，现在经常犯下将内容纳入设计的不可告人的罪过。（如果 HTML 文件中的部分标题要更改，则显示的部分标题不会更改）。

Which only goes to show that even those advocate the strict DIV & CSS religion, can't follow their own rules. You may use that as a guideline in how closely you follow them.

这只能说明，即使是那些提倡严格的 DIV 和 CSS 信仰的人，也不能遵循自己的规则。您可以将其用作指导您遵循它们的程度的指南。

回答by expedient

This isn't the definitive argument, by any means, but with CSS you can take the same markup and change the layout depending on medium, which is a nice advantage. For a print page you can quietly suppress navigation without having to create a printer-friendly page, for example.

无论如何，这不是决定性的论点，但是使用 CSS，您可以采用相同的标记并根据媒体更改布局，这是一个很好的优势。例如，对于打印页面，您可以安静地抑制导航，而无需创建适合打印的页面。

回答by Ben Scheirman

One table for layout wouldn't be that bad. But you can't get the layout you need with just one table most of the time. Pretty soon you have 2 or three nested tables. This becomes very cumbersome.

一张桌子的布局不会那么糟糕。但是大多数情况下，您无法仅使用一张桌子就获得所需的布局。很快你就会有 2 或 3 个嵌套表。这变得非常麻烦。

• It IS a LOT harder to read. That's not up to opinion. There's just more nested tags with no identifying marks on them.

• Separating content from presentation is a good thing because it allows you to focus on what you're doing. Mixing the two leads to bloated pages that are hard to read.

• CSS for styles allows your browser to cache the files and subsequent requests are much faster. This is HUGE.

• Tables lock you into a design. Sure, not everyone needs the flexibility of CSS Zen Garden, but I've never worked on a site where I didn't need to change the design a little bit here and there. It's much easier with CSS.

• Tables are hard to style. You don't have very much flexibility with them (i.e. you still need to add HTML attributes to fully control a table's styles)

• 阅读起来要困难得多。这不取决于意见。只是有更多的嵌套标签，上面没有识别标记。

• 将内容与演示分开是一件好事，因为它可以让您专注于您正在做的事情。将两者混合会导致页面臃肿，难以阅读。

• 样式的 CSS 允许您的浏览器缓存文件，随后的请求会更快。这是巨大的。

• 表格将您锁​​定在设计中。当然，不是每个人都需要 CSS Zen Garden 的灵活性，但我从来没有在一个网站上工作过，我不需要在这里和那里稍微改变设计。使用 CSS 就容易多了。

• 桌子很难设计。你对它们没有很大的灵活性（即你仍然需要添加 HTML 属性来完全控制表格的样式）

I haven't used tables for non-tabular data in probably 4 years. I haven't looked back.

我大概有 4 年没有使用表格来处理非表格数据了。我没有回头。

I'd really like to suggest reading CSS Masteryby Andy Budd. It's fantastic.

我真的很想建议阅读Andy Budd 的CSS Mastery。这是梦幻般的。

Image at ecx.images-amazon.com http://ecx.images-amazon.com/images/I/41TH5NFKPEL._SL500_BO2,204,203,200_PIsitb-dp-500-arrow,TopRight,45,-64_OU01_AA240_SH20_.jpg

图片在 ecx.images-amazon.com http://ecx.images-amazon.com/images/I/41TH5NFKPEL._SL500_BO2,204,203,200_PIsitb-dp-500-arrow,TopRight,45,-64_OU01_AA240_SH20

回答by 17 of 26

It's good to separate content from layout
But this is a fallacious argument; Cliche Thinking

将内容与布局分开是好的，
但这是一个错误的论点；陈词滥调

It's a fallacious argument because HTML tables are layout! The content is the datain the table, the presentation is the table itself. This is why separating CSS from HTML can be very difficult at times. You're not separating content from presentation, you're separating presentation from presentation! A pile of nested divs is no different than a table - it's just a different set of tags.

这是一个错误的论点，因为 HTML 表格是布局！内容是表格中的数据，展示的是表格本身。这就是为什么有时将 CSS 与 HTML 分开会非常困难的原因。您不是将内容与演示分开，而是将演示与演示分开！一堆嵌套的 div 与表格没有什么不同——它只是一组不同的标签。

The other problem with separating the HTML from the CSS is that they need intimate knowledge of one another - you really can't separate them fully. The tag layout in the HTML is tightly coupled with the CSS file no matter what you do.

将 HTML 与 CSS 分开的另一个问题是，它们需要彼此之间的深入了解——你真的无法将它们完全分开。无论您做什么，HTML 中的标记布局都与 CSS 文件紧密耦合。

I think tables vs divs comes down to the needs of your application.

我认为表格与 div 归结为您的应用程序的需求。

In the application we develop at work, we needed a page layout where the pieces would dynamically size themselves to their content. I spent days trying to get this to work cross-browser with CSS and DIVs and it was a complete nightmare. We switched to tables and it all just worked.

在我们在工作中开发的应用程序中，我们需要一个页面布局，其中各个部分将根据其内容动态调整大小。我花了几天时间试图让它跨浏览器与 CSS 和 DIV 一起工作，这简直是一场噩梦。我们切换到表格，这一切只是工作。

However, we have a very closed audience for our product (we sell a piece of hardware with a web interface) and accessibility issues are not a concern for us. I don't know why screen readers can't deal with tables well, but I guess if that's the way it is then developers have to handle it.

但是，我们的产品有非常封闭的受众（我们销售带有 Web 界面的硬件）并且可访问性问题不是我们关心的问题。我不知道为什么屏幕阅读器不能很好地处理表格，但我想如果是这样，那么开发人员就必须处理它。

回答by Tim Black

CSS/DIV - it's just jobs for the design boys, isn't it. The hundreds of hours I've spent debugging DIV/CSS issues, searching the Internet to get some part of markup working with an obscure browser - it drives me mad. You make one little change and the whole layout goes horrendously wrong - where on eath is the logic in that. Spending hours moving something 3 pixels this way then something else 2 pixels the other to get them all to line up. This just seems plain wrong to me somehow. Just because you're a purist and something is "not the right thing to do" doesn't mean you should make use of it to the nth degree and under all circumstances, especially if it makes your life 1000 times easier.

CSS/DIV - 这只是设计男孩的工作，不是吗。我花了数百个小时调试 DIV/CSS 问题，在 Internet 上搜索以获取与一个不起眼的浏览器一起工作的标记的某些部分 - 这让我发疯。你做了一个小小的改变，整个布局就出现了可怕的错误——这其中的逻辑在哪里。花费数小时以这种方式移动 3 个像素，然后以其他方式移动其他 2 个像素，以使它们全部对齐。不知何故，这对我来说似乎是完全错误的。仅仅因为你是一个纯粹主义者并且某些事情“不正确的做法”并不意味着你应该在所有情况下充分利用它，尤其是如果它让你的生活变得轻松 1000 倍。

So I've finally decided, purely on commercial grounds, although I keep use to minimum, if I anticipate 20 hours work to get a DIV placed correctly, I'll stick in a table. It's wrong, it upsets the purists, but in most cases it costs less time and is cheaper to manage. I can then concentrate on getting the application working as the customer wants, rather than pleasing the purists. They do pay the bills after all and my argument to a manager enforcing the use of CSS/DIV - I would merely point out the customers pay his salary as well!

所以我最终决定，纯粹是出于商业原因，虽然我尽量减少使用，但如果我预计需要 20 小时的工作才能正确放置 DIV，我会坚持在桌子上。这是错误的，它让纯粹主义者感到不安，但在大多数情况下，它花费的时间更少，管理起来也更便宜。然后我可以专注于让应用程序按照客户的要求工作，而不是取悦纯粹主义者。毕竟他们确实支付了账单，而我对强制使用 CSS/DIV 的经理的争论 - 我只想指出客户也支付他的薪水！

The only reason all these CSS/DIV arguments occur is because of the shortcoming of CSS in the first place and because the browsers aren't compatible with each other and if they were, half the web designers in the world would be out of a job.

所有这些 CSS/DIV 参数出现的唯一原因首先是因为 CSS 的缺点，并且因为浏览器彼此不兼容，如果兼容，世界上一半的网页设计师将失业.

When you design a windows form you don't try moving controls around after you have laid them out so I kind of think it's strange to me why you would you want to do this with a web form. I simply can't understand this logic. Get the layout right to start with and what's the problem. I think it's because designers like to flirt with creativity, whilst application developers are more concerned with actually getting the application working, creating business objects, implementing business rules, working out how bits of customer data relates to each other, ensuring the thing meets the customers requirements - you know - like the real world stuff.

当您设计 Windows 窗体时，您不会在布置控件后尝试四处移动控件，所以我觉得我很奇怪为什么您要使用 Web 窗体执行此操作。我简直无法理解这个逻辑。正确地开始布局以及有什么问题。我认为这是因为设计师喜欢玩弄创造力，而应用程序开发人员更关心让应用程序实际运行、创建业务对象、实施业务规则、确定客户数据的各个位如何相互关联，确保事物满足客户需求要求 - 你知道 - 就像现实世界的东西。

Don't get me wrong, both arguments are valid, but please don't critise developers for choosing an easier, more logical approach to designing forms. We often have more important things to worry about than the correct semantics of using a table over a div.

不要误会我的意思，这两个论点都是有效的，但请不要批评开发人员选择一种更简单、更合乎逻辑的方法来设计表单。我们经常有比在 div 上使用 table 的正确语义更重要的事情要担心。

Case in point - based on this discussion I converted a few existing tds and trs to divs. 45 minutes messing about with it trying to get everything to line up next to each other and I gave up. TDs back in 10 seconds later - works - straight away - on all browsers, nothing more to do. Please try to make me understand - what possible justification do you have for wanting me to do it any other way!

举个例子 - 基于这个讨论，我将一些现有的 tds 和 trs 转换为 divs。45 分钟搞乱了它试图让所有东西彼此对齐，我放弃了。TDs 在 10 秒后返回 - 工作 - 立即 - 在所有浏览器上，无需其他操作。请试着让我明白——你有什么理由想要我以其他方式做这件事！

回答by needlestack

Layout should be easy. The fact that there are articles written on how to achieve a dynamic three column layout with header and footer in CSS shows that it is a poor layout system. Of course you can get it to work, but there are literally hundreds of articles online about how to do it. There are pretty much no such articles for a similar layout with tables because it's patently obvious. No matter what you say against tables and in favor of CSS, this one fact undoes it all: a basic three column layout in CSS is often called "The Holy Grail".

布局应该很容易。有关于如何在 CSS 中实现带有页眉和页脚的动态三列布局的文章表明这​​是一个糟糕的布局系统。当然，你可以让它工作，但网上有数百篇关于如何做到这一点的文章。几乎没有类似表格布局的文章，因为它很明显。无论您反对表格还是赞成 CSS，这一事实都会使这一切无效：CSS 中的基本三列布局通常被称为“圣杯”。

If that doesn't make you say "WTF" then you really need to put down the kool-aid now.

如果这不能让你说“WTF”，那么你现在真的需要放下 kool-aid 了。

I love CSS. It offers amazing styling options and some cool positioning tools, but as a layout engine it is deficient. There needs to be some type of dynamic grid positioning system. A straightforward way to align boxes on multiple axis without knowing their sizes first. I don't give a damn if you call it <table> or <gridlayout> or whatever, but this is a basic layout feature that is missing from CSS.

我喜欢 CSS。它提供了惊人的样式选项和一些很酷的定位工具，但作为一个布局引擎，它是有缺陷的。需要某种类型的动态网格定位系统。在不知道它们的大小的情况下在多个轴上对齐框的直接方法。如果你称它为 <table> 或 <gridlayout> 或其他什么，我不在乎，但这是 CSS 中缺少的基本布局功能。

The larger problem is that by not admitting there are missing features, the CSS zealots have been holding CSS back from all it could be. I'd be perfectly happy to stop using tables if CSS provided decent multi-axis grid positioning like basically every other layout engine in the world. (You do realize this problem has already been solved many times in many languages by everyone except the W3C, right? And nobody else denied that such a feature was useful.)

更大的问题是，由于不承认存在缺失的功能，CSS 狂热者一直在阻止 CSS 尽其所能。如果 CSS 基本上像世界上所有其他布局引擎一样提供了不错的多轴网格定位，我将非常乐意停止使用表格。（你确实意识到这个问题已经被除 W3C 之外的所有人用许多语言解决了很多次，对吧？没有人否认这样的特性是有用的。）

Sigh. Enough venting. Go ahead and stick your head back in the sand.

叹。足够的通风。继续，把你的头埋在沙子里。