为什么要使用表格来构建布局? [英] Why use tables to structure your layout?

查看:33
本文介绍了为什么要使用表格来构建布局?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

查看 Stack Overflow 的源代码,我注意到他们大量使用表格和内联 CSS,我还发现奇怪的是使用内联表格属性格式.

Looking at the source code for Stack Overflow, I noticed they have used tables and inline CSS quite a bit, also something I found odd was use of inline table attribute formatting.

我只是很好奇他们为什么使用表格来构建模板而不是流行的(或曾经流行的)DIV 是否有任何具体原因.

I'm just curious if there was any specific reason(s) to why they used tables to structure their template instead of the popular (or used to be popular) DIVs.

同样......使用 CSS 的目的包括在同一页面上使用内联 CSS(我知道可能有一个很好的答案/解决方案......我只是好奇它们是什么)

As well...the purpose of using CSS includes and using inline CSS on the same page (I know there is probably a great answer/solution(s) for this...I'm just curious to what they are)

我知道将表格用于表格数据并没有错……但在这种情况下,堆栈溢出表格用于结构.

I understand there is nothing wrong with using tables for tabular data...but in this case Stack Overflows tables are used for structure.

推荐答案

Tables vs. Divs 是一场毫无意义的圣战.

Tables vs. Divs is a pointless holy war.

以特定方式使用表格布局可能会导致问题的特定问题.其中之一是在单个表格中构建整个站点布局以处理边距和位置——由于表格的呈现方式,这通常意味着网站不会随着内容下载而被浏览器引擎逐步呈现,并且只能在收到整个事物后呈现.对于大页面或慢速调制解调器用户,他们可能会盯着空白页面很长一段时间,这是坏事".不要介意 mozilla/ie5 代浏览器中表格渲染的许多不一致,这使得一致的跨浏览器表格布局有些痛苦,尤其是单元格中的图像.

There are specific issues with using tables in particular ways for layout that can cause problems. One of these is building an entire site layout in a single table in order to handle margins and placement -- because of the way tables are rendered this frequently means a website will not render progressively by the browser engine as the content downloads, and can only be rendered after the entire thing has been received. For a large page or slow modem user, they may be staring at a blank page for quite a while, which is a "Bad Thing". Never mind a lot of the inconsistencies in table rendering in the mozilla/ie5 generation of browsers that made consistent cross-browser table layouts somewhat painful, especially with images in the cells.

纯 div 路径的支持者喜欢谈论内容与展示,因为理论上 HTML 4.01 是纯内容,所有这些都有意义.div 在抽象意义上提供了有意义的组织结构,然后由 CSS 专门给出了表示.在这些参数中,表仅在用于包含实际表格数据时才有效.当然,这忽略了这样一个事实:对于任何足够复杂的布局,几乎总是有相当多的空 div 漂浮在周围,只是为了支持演示 CSS 的必要钩子,打破了这种抽象的第一级.一旦这种抽象被打破,就没有法律规定,当您的布局只需要 HTML 中没有有意义内容的表示挂钩时,div 在某种程度上比表格更合适.如果您在选择无意义的 div 或无意义的表格以使布局工作时遇到困难,请选择更容易的.

Supporters of the pure div path like to talk about content vs. presentation, because in theory HTML 4.01 is pure content, all of it meaningful. The divs provide meaningful organizational structure in an abstract sense, which is then given presentation exclusively by CSS. In these arguments, tables are valid only if being used to contain actual tabular data. Of course, this ignores the fact that for any sufficiently complex layout, there are almost always quite a few empty divs floating around simply to support the necessary hooks for presentation CSS, breaking the first level of this abstraction. Once this abstraction is broken, there's no law stating that, when your layout simply requires a presentation hook in the HTML that has no meaningful content, a div is somehow more appropriate than a table. If you are stuck with the choice of a meaningless div or a meaningless table in order to make your layout work, choose whichever is easier.

最后,这是关于了解所有方法的局限性并使用最合适的方法.在许多情况下,使用表格比设置无意义(即非内容有意义)的 div 数组更容易,并且表格呈现限制不适用.如果表格很小并且代表内部内容的一小部分,则渲染延迟无关紧要.

In the end, it's about being aware of the limitations in all methods and using the one that is most appropriate. There are many cases where using a table is simply easier than setting up a pointless (i.e. not-content-meaningful) array of divs, and the table rendering limitations don't apply. If the table is small and represents a minor chunk of the interior content, the rendering delay is not relevant.

这篇关于为什么要使用表格来构建布局?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆