代码之家  ›  专栏  ›  技术社区  ›  Niyaz

在HTML中应该不惜任何代价避免使用表吗?

  •  34
  • Niyaz  · 技术社区  · 16 年前

    建议在HTML页面中使用表(现在我们有了CSS)?

    表格的应用是什么?表格有哪些不在CSS中的功能?

    相关问题

    27 回复  |  直到 16 年前
        1
  •  76
  •   Mark Cidade    16 年前

    不-一点也不。但使用表格数据。只是不要把它们用于一般的布局。

    但是,如果您显示表格数据,比如结果,甚至是表单,请继续使用表格!

        2
  •  69
  •   Todd Davis    16 年前

    我想我不是这里的大多数,但是我仍然看到在HTML中表有很多用途。当然,是的,对于像表格这样的东西,你根本无法打败一张桌子。尝试排列标签和附带的表单字段当然可以使用DIV,但在某些情况下,这将是一个多大的pita,并且调整页面的大小是很难看的。这里的桌子很神奇。

    但也要考虑更大的问题。例如,是否尝试只使用DIV和CSS创建带有页眉和页脚的标准3列布局?同样,这是非常可能的,有大约1000个网站有例子,但他们都有同样的问题。第一个问题是,如果没有某种javascript帮助,列永远不会真正喜欢变成相同的高度。第二个问题是改变布局通常是一件棘手的事情,因为从一开始就让一切“恰到好处”是一种平衡的行为,所以你不想把它搞得一团糟。最后,回到最后一点,这并不容易。你必须把所有的DIV布局好,然后回去创建一个神奇的CSS,迫使这些DIV进入正确的位置,然后花几个小时来调整它,直到它正确。呃。然后在没有浏览器的情况下查看HTML真的让你不知道页面是什么样子的,因为它最终都被CSS重新解释了。

    现在,选项B。使用一张桌子。花大约30秒的时间输入<tr>和<td>标记,可能根本没有CSS,没有javascript“fixit”,只需查看HTML就可以确切了解它的外观。

    当然,也有支持和反对表格的论据,而且纯粹主义者似乎倾向于使用DIV的布局,但不要因为宗教原因而使用DIV,因为有人告诉你表格是邪恶的。使用最适合您、您的页面以及您的观众与页面交互的方式。如果那是一张桌子,那就用它。如果没有,不要。

        3
  •  12
  •   nickf    16 年前

    到目前为止,每个人都说过表应该只用于表数据,这是真的。看看上面任何页面的HTML源代码,你会发现它们有不同的想法…

    我认为他们的理由是 有时 使用桌子就简单多了。但是,有很多非常好的可用性理由可以避免使用它们。

        4
  •  11
  •   Jonny Buchanan    16 年前

    除了 tabular data ,如果要创建 灵活的 网格布局,如以跨浏览器兼容方式的复杂表单。

    CSS2支持创建灵活的网格布局,而不使用 table 元素通过 display property 但这是 not supported in IE6 or IE7 .

    然而,对于大多数基本的表单布局,CSS应该是足够的。

        5
  •  6
  •   Paul Prewett    16 年前

    如果在设置“类似表格”的布局时,只有CSS等价物才是有利的,那么我希望使用CSS。我发现模仿其他人在这里列出的东西所花的时间(单元格高度相等,行数自动增长等)根本不值得这么做。在大多数情况下,我不会从投资中获得回报,而不是快速拼凑一张桌子。

    所有浏览器都可以就表的布局方式达成一致。BAM。完成。

    我的css follies通常是这样的: 尝试在CSS中设置类似表格的布局。花20分钟或更多时间在Mozilla中获得所有东西,然后在IE中打开它。再花30分钟在这两个浏览器之间进行调整。假装世界上只有两个浏览器,因为我实际上需要完成一些工作。

    我相信CSS的承诺:分离关注点。问题是,对于那些需要提高生产力的人来说,CSS还没有准备好迎接黄金时间。或者可能是浏览器的渲染引擎——无论哪个。

        6
  •  4
  •   David Webb    16 年前

    CSS的好处在于它将设计和布局与内容分开。

    如果您有表格数据,那么使用 <TABLE> 标签。如果要布局不同的内容块,则应使用 <DIV> <SPAN> 和CSS。

        7
  •  3
  •   Mike Dimmick    16 年前

    表用于输出表格数据。在电子表格中显示的任何内容,结果列,诸如此类。

    使用CSS而不是表的建议是用于柱状布局,这不是真正的表。从未打算建议完全删除表。

        8
  •  3
  •   richrumble    16 年前

    在css2中,表没有等价物,而且使用css复制表也不容易。表中很难重现的特殊部分是列的自动调整大小。虽然很容易让1行在整个页面上增长到相同的大小,但是下一行很难动态匹配列大小或每个单元格大小,实际上,如果不使用其他脚本语言(如javascript、php或其他)就无法完成。您可以使用最大和最小宽度,以及为单元格大小或硬代码单元格宽度设置百分比,但是动态增长的单元格在1行中工作良好,下面的下一行不匹配。

        9
  •  3
  •   kelly    15 年前

    扫描这些答案,我没有看到一个现实世界的原因,在那里表格是必要的布局,那就是HTML电子邮件。

    我在一家非常,非常大的金融公司工作,我们每月跟踪大约600个不同的工作……其中许多都是多个电子邮件活动。

    对于任何邮件阅读器,都不能使用CSS进行布局。有一些内嵌的CSS规格,你可以使用的颜色,字体和大小,甚至行高是相当广泛的可用,但布局,你必须使用表作为所有主要和最次要的电子邮件阅读器(Outlook 97/03,随行人员,MSN等)读他们刚刚好。

    当您有没有指定高度/宽度的TD时,表的问题就会起作用,不管它们是否包含数据。所以,“坏的”表布局通常是通过关注属性来修复的,是的……HTML中的空白……是的,空白并不重要。

    所以,如果你曾经为一家大公司/公司工作,或者你找到了一个非常大的客户,就要准备好把所有当前的技术都扔出去,戴上你的HTML桌面帽!

        10
  •  2
  •   Matthew Cole    16 年前

    我认为这一切都取决于时间/努力。虽然一个纯粹主义者可能会说“只使用表作为表格数据”,但我过去使用表来简化跨浏览器的布局。

    对我来说,这是时间利用的问题。我要么把时间花在处理好CSS上,要么把它扔到桌子上,花的时间少得多。我倾向于走这条路,直到一切正常运转。一旦有了这个功能,我就回去润色一下css/html。

        11
  •  2
  •   Thomas    16 年前

    我得走这边的桌子。原因就在于成本。直到一个支持良好的以CSS为中心的布局方法出现,而我所说的是宏级别的……而不是容器内的微级别,尝试将CSS定位推到一个通用的布局方法是无效的。您必须从编写开发检查的人员的角度来处理这个问题。

    几年前,我签约开发和维护一个大型连锁酒店的网站。我们使用了表驱动的布局;基本的页眉、正文、页脚和左/右列。我们还为一些更精细的元素使用了表格,比如非图形按钮。该连锁店的母公司维护了自己的网站,并采用了纯CSS的布局方法。当IE7出现时,我们的网站工作得很好,没有任何变化。母公司的网站一团糟。总的来说,他们花了大约1000个小时(在会议/开发/质量保证/首次展示之间)来解决问题。

    当你被付钱开发一个网站时,你的部分责任是减轻未来的风险,并尽量减少未来的开发成本,特别是如果这些成本不能为网站(你的产品)增加价值的话。

        12
  •  1
  •   Olaf Kock    16 年前

    关于这一点,我非常简单和基本的观点是,表是为表数据而存在的,而不是为了将一个东西放在另一个元素的顶部或旁边,因为您碰巧喜欢它在那里。

    所以-如果您想显示一个数据表:那么就这样做(使用一个表)。如果你想在页面上定位内容:使用CSS。

        13
  •  1
  •   snr    16 年前

    我想你可能有点困惑。CSS是HTML文档样式的一种方法,无论它是表元素还是“div”。

    过去,HTML中使用表来设计整个页面布局。经常会看到多个嵌套表(通常由Dreamweaver等WYSIWYG程序生成),这会导致维护噩梦。

    由于引入和采用了CSS样式表,现在只使用表作为表格数据是正确的。这意味着,如果您的数据最自然地呈现为表,则使用table元素。您仍然可以使用CSS设置表格样式。

    但是,我通常不赞成这种方法,因为它复制了现有的功能,所以可以使用元素来构建一个类似表的结构。事实上,有几个网站会为你生成这样的代码,但我没有手边的链接。

    还请记住,有些用户可能是在纯文本模式下查看,或者使用屏幕阅读器,两者都可能会打断页面(如垂直而不是水平地读取列),因此可以正确地使用表。

    高温高压

        14
  •  1
  •   petr k.    16 年前

    我相信并希望使用表格进行布局的时代已经过去。简单地说: 一张桌子就是一张桌子,没有别的了 .

    我认为未来几年新的,类似的,火焰战主题是:我应该使用新的CSS特性吗? 显示 : 桌子 , 表格单元 , 表格行 布局等????-)

        15
  •  1
  •   Joe    16 年前

    我认为之所以出现这种情况,是因为在创建结构和布局时,使用HTML表比使用CSS更容易理解。使用CSS更抽象,但有助于分离代码。

    作为对“structure”参数的回应…根据定义,不是使用HTML表为数据提供结构,以便您将其标识为“tableable”。无论是CSS还是HTML,您都在控制数据的流和布局。不管是表格还是其他…

    如果CSS表如此重要(我确信我的答案会引发某种形式的火焰战),为什么在Visual Studio中没有一种机制来使用CSS创建布局?哦,你没检查过VS的布局特征吗?是的,你可以直接从微软拿到桌子。我不是在抱怨,只是想说,如果这对世界其他地方同样重要,你会看到MS切换到CSS。

    在我看来,做最适合你项目的事。对于一两页的Web项目,我仍然使用HTML,因为它的作用是显而易见的。使用CSS更抽象,有些早上我只是没喝那么多咖啡。HTML表可能会变得混乱、快速。CSS需要更多的时间来变得凌乱,但也会。

        16
  •  1
  •   KnoVz    16 年前

    尽管对于某些布局来说,使用表格一开始看起来可能更简单,但当维护时间到来时,使用CSS会有回报。尤其是如果你想改变某个东西的位置,或者你想在几个地方使用相同的布局。

    imho,表格只能在展示表格时使用。不得用于布局目的。

        17
  •  0
  •   mercutio    16 年前

    表格用于显示表格数据。没有什么别的可以补充的了-d

        18
  •  0
  •   jaeggli    16 年前

    如果有理由以语义方式使用表(例如显示表格数据),请使用表。

    只需不使用表格来进行布局。使用语义标记可以获得许多搜索引擎和可访问性好处。

        19
  •  0
  •   Russell Leggett    16 年前

    大多数情况下,保留表仅用于表格数据。有些布局问题比其他任何问题都更容易用表实现。例如,垂直对齐和等高列。在围栏的另一边,有一些复杂的数据表,我使用浮动分隔,因为这些表不适合账单。

    像其他任何事情一样,为正确的工作使用正确的工具,有时最实用的工具不是你认为的那样。也就是说,即使在我给出的示例中,我也很少使用表进行布局,因为不可避免地我遇到了一些问题,使我不得不使用CSS。您的里程可能会有所不同。

        20
  •  0
  •   rslite    16 年前

    我也不喜欢用表格来安排页面上的项目。然而,这不应该成为一个宗教-桌子是坏的。我遇到过一个例子,我有一个三列布局,需要中心列随内容增长。最后,最简单、在所有需要的浏览器上都工作良好的解决方案是使用表。imho-css仍然有一些缺点,有时最好使用一些简单有效的东西,而不是盲目地坚持某些想法(“表是坏的…”)。

        21
  •  0
  •   Gunstick    16 年前

    如果您的布局有点表格化,您甚至可以使用它们进行布局。我喜欢动态调整表格和单元格的功能,以适应浏览器窗口的宽度。 不要使用任何固定的宽度或高度,那只会把事情搞得一团糟。

        22
  •  0
  •   ofaurax    16 年前

    这很容易。 把你的网页想象成纸上的真实页面。 只有在纸上绘制表格时,才应使用网页上的表格。

    另一个技巧是只将表格与border>0一起使用。 这样,只有当您 意思是 您需要一个表(而不是布局)。

        23
  •  0
  •   chrisofspades    16 年前

    @Toddhd,提倡使用表进行布局只是为了节省时间是一种逃避。如果时间是问题所在,那么您可以使用类似 Blueprint CSS 960 Grid .

        24
  •  0
  •   mccormicky    15 年前

    似乎取决于你开始设计时浏览器的功能。如果您在只有表工作的时候才开始工作,那么您可能永远都想使用它,因为您知道它。或者,如果这是您喜欢使用的,即使在浏览器已经高级,能够呈现CSS…

    我只是不喜欢一遍又一遍地做同样的事情,因为它们很容易,而且我知道怎么做。这很无聊。我更愿意学习新技术,而不是因为我不知道如何使用它或我认为我没有时间去学习。

    我不喜欢用桌子,我不懂,它们看起来很陌生,很冒犯人,但那是因为我从2005年开始。我也不使用设计程序来吐出模板,因为我更喜欢手工编码。

        25
  •  -1
  •   Loren Charnley    16 年前

    我假设你的问题实际上是- “我应该避免使用HTML表进行布局吗?” . 答案是:没有。事实上,表是专门用来控制布局的。使用表控制整个页面布局的缺点是,源文件很快变得难以手动理解和编辑。使用表控制整个布局的一个(可能的)好处是,如果对跨浏览器兼容性和呈现有特定的关注。我更喜欢直接使用HTML源文件,对于我来说,使用CSS比在整个布局中使用表更容易。

        26
  •  -1
  •   Luis Abreu    16 年前

    只有当您试图显示表格数据时,表才有意义。对于布局,您应该始终使用分隔符并使用CSS定位。

        27
  •  -4
  •   Johnny    15 年前

    如果你需要使用一张桌子,你的布局可能很糟糕。给我看一个设计良好的使用表格的网站,我会给你看一千个没有的网站。

    很多人都把“纯粹主义”这个词抛在脑后。这是垃圾。你能把报纸的副本印在书上吗?你能用Excel设计一个小册子吗?不?那么,为什么要使用表来显示非表格式的数据呢?

    大多数时候,人们在放弃表格进行布局时所面临的困难是由于他们对HTML/CSS/良好的设计原则的无知。虽然您可能会发现很难使多列布局在垂直方向上均匀扩展,但您可能会考虑尝试其他方法。沙发床不是桌子。你可以使用宽边框、页面背景等制作人造专栏。花一些时间实际学习你要做的事情,或者永远被视为一个没有任何有用技能的人。( http://www.alistapart.com 会是个好的开始)

    我真的很惊讶这个问题在2008年突然出现。我上高中的时候,有很多女学生。别再当笨蛋了。

    正如上面提到的,在移动设备和屏幕阅读器上,表格很难失效。