几年前，我研究了屏幕阅读器和表格的问题，得出了与大多数开发者想法相矛盾的信息:

http://www.webaim.org/techniques/tables/

你可能会听到一些易访问性倡导者说布局表是一个坏主意，应该使用CSS布局技术。他们说的有道理，但是，老实说，在可访问性方面，使用表格进行布局并不是最糟糕的事情。只要桌子在设计时考虑到可访问性，各种残疾的人都可以轻松地使用桌子。”

Flex有一个标签，用于在垂直列中布局内容。说实话，我不认为他们在布局/内容方面做得很好，但至少他们已经解决了这个问题。

像许多对CSS感到沮丧的人一样，我也到处寻找一个简单的答案，当我以为我找到了它时，我感到兴奋，然后当我在Chrome中打开页面时，我的希望破灭了。我肯定没有足够的技能说这是不可能的，但我还没有看到任何人提供样本代码供同行评审，明确地证明它可以可靠地完成。

那么，这个岛的CSS方面有人能推荐一种布局垂直列的心态/方法吗?我尝试过在第二行和第三行绝对定位，但我最终与到处重叠的东西和浮动有类似的问题，如果页面缩小。

如果这个问题有答案，我会欣喜若狂地做正确的事情——只要告诉我一些像“嘿，你试过**流:垂直|水平”这样的事情，我就完全不烦你了。

我不得不用这两种方式来做网站，再加上第三种，可怕的“混合”布局，包括表格、div和样式:div /CSS轻松胜出。

为了匹配一个表格单元格的代码权重，您必须立即嵌套三个深度的div。这种效果会随着嵌套表的增加而扩大。

我也更喜欢做一个布局变化，而不是一个变化，在我的网站的每一页。

我可以完全控制divs/css的各个方面。表格以一种可怕的方式把它搞得一团糟，尤其是在IE浏览器中，我从来没有选择不支持这个浏览器。

我维护或重新设计一个div /css网站的时间只是表格的一小部分。

最后，我可以用CSS和几乎任何脚本语言创新多种可切换的布局。这对我来说是不可能的。

在你做决定的时候，祝你的投资回报率好运。

我很惊讶地发现有些问题还没有涉及到，所以除了之前提出的所有非常有效的观点之外，以下是我的2点看法:

.1.CSS & SEO：

a) CSS used to have a very significant impact on SEO by allowing to position the content in the page wherever you want. A few years ago, Search Engines were giving a significant emphasis to "on-page" factors. Something at the top of the page was deemed more relevant to the page than something located at the bottom. "Top of the page" for a spider meant "at the beginning of the code". Using CSS, you could organize your keyword-rich content at the beginning of the code, and still position it wherever you liked in the page. This is still somewhat relevant, but on page factors are less and less important for page ranking.

b)当布局转移到CSS时，HTML页面更轻，因此对于搜索引擎蜘蛛加载更快。(蜘蛛不需要下载外部CSS文件)。快速加载页面是一个重要的排名考虑几个搜索引擎，包括谷歌

c) SEO工作通常需要测试和更改内容，这与基于CSS的布局更方便

。2。生成的内容:

用编程方式生成表要比等效的CSS布局容易得多。

foreach ($comment as $key=>$value)
{
   echo "<tr><td>$key</td><td>$value</td></tr>";
}

生成表很简单，也很安全。它是自包含的，可以很好地集成到任何模板中。用CSS做同样的事情要困难得多，而且可能根本没有任何好处:很难在飞行中编辑CSS样式表，并且内联添加样式与使用表没有什么不同(内容没有与布局分离)。

此外，在生成表时，内容(在变量中)已经与布局(在代码中)分离，使其易于修改。

这就是为什么一些设计非常好的网站(例如SO)仍然使用表格布局的原因之一。

当然，如果需要通过JavaScript对结果进行操作，那么div是值得的。

。3。快速转换测试

在找出适合特定受众的方法时，能够以各种方式更改布局以找出最佳结果是很有用的。基于CSS的布局使事情变得相当简单

。4。不同的问题有不同的解决方案

布局表通常被鄙视，因为“每个人都知道div和CSS”才是正确的方式。

然而，事实仍然是，表创建更快，更容易理解，比大多数CSS布局更健壮。(是的，CSS可以很健壮，但是在不同的浏览器和屏幕分辨率上快速浏览一下网络就会发现情况并非如此)

桌子有很多缺点，包括维护、缺乏灵活性……但是我们不要把孩子和洗澡水一起丢了。快速可靠的解决方案有很多专业用途。

前段时间，我不得不用表格重写了一个干净简单的CSS布局，因为相当一部分用户会使用对CSS支持非常差的旧版本IE

就我而言，我已经厌倦了“哦，不!”布局的表格!”

至于那些“它不是为了这个目的而设计的，因此你不应该这样使用它”的人群，这不是虚伪吗?你怎么看待所有的CSS技巧，你必须使用使该死的东西工作在大多数浏览器?他们是为了这个目的吗?

在维护内容的同时进行网站维护和设计检修(这一直都在发生，尤其是在电子商务中):

内容和设计通过表格混合在一起=更新内容和设计。

内容与设计分离=更新设计和少量内容。

如果我有自己的方式，我会将内容保存在PHP中，生成XML，转换为XSLT中的标记，并使用CSS和Javascript进行交互设计。对于Java方面的东西，JSP到JSTL来生成标记。

我很抱歉我的英语不好，但还有一个原因:

我在一些政府机构工作，不使用TABLE的首要原因是残疾人。他们使用机器“翻译”网页。

问题是这个“翻译机器”不能阅读网站，如果它是由TABLE。为什么?因为TABLE是用于数据的。

事实上，如果你使用TABLES，你必须为每个cell指定一些信息，让残疾人知道他们在TABLE中的位置。想象一下，你有一个大表格，必须放大才能看到屏幕上的一个单元格:你必须知道你在哪一行/col。

因此，使用DIV，并且禁用可以简单地阅读文本，并且不会得到一些关于行/cols的奇怪信息，当它们不需要在那里时。

我也更喜欢TABLE来制作快速简单的模板，但我现在习惯了CSS…它很强大，但你真的必须知道你在做什么……：）