相关疑难解决方法(0)

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

为什么？

我从来没有(或很少诚实地)看到这方面的好论据.通常的答案是:

• 将内容与布局分开是件好事
  但这是一个错误的论点; 陈词滥调.我想使用表格元素进行布局与表格数据几乎没有关系.所以呢？我的老板在乎吗？我的用户在乎吗？
  
  也许我或我的开发人员必须维护一个网页关注......一个表不易维护吗？我认为使用表比使用div和CSS 更容易.
  
  顺便说一下...为什么使用div或span将内容与布局和表格分开？只使用div来获得一个好的布局通常需要很多嵌套的div.

• 代码的可读性
  我认为这是另一种方式.大多数人都懂HTML,很少有人理解CSS.

• SEO最好不要使用表格
  为什么？任何人都可以证明它是有证据的吗？或谷歌发表的声明表示,从SEO的角度来看,表格是不受欢迎的？

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

• 如果没有桌子,布局检修会更容易,请参阅css Zen Garden.
  大多数需要升级的网站也需要新内容(HTML).新版本的网站只需要新的CSS文件的情况不太可能发生.Zen Garden是一个不错的网站,但有点理论上.更不用说它滥用 CSS了.

我真的对使用divs + CSS而不是表格的好参数感兴趣.

我知道表格是用于表格数据的,但是将它们用于布局是很诱人的.我可以处理DIV以获得三列布局,但是当你有4个嵌套DIV时,它会变得棘手.

有没有教程/参考来说服我使用DIV进行布局？

我想使用DIV,但我拒绝花一个小时将我的DIV/SPAN定位在我想要的地方.

@GaryF:Blueprint CSS必须是CSS最好的秘密.

伟大的工具 - Blueprint Grid CSS Generator.

[Meta-note:]我正在浏览问题页面,真的厌倦了"DIVS vs Tables""何时使用表格与DIVS""Divs比桌子更好""表格与CSS"以及所有问题相同的问题尽管如此,但是我希望看到人们解决"为什么你应该放弃并使用表格"的规范范例的翻译方式:

<table>
  <tr>
    <td> Name </td>
    <td> <input> </td>
  </tr>
  <tr>
    <td> Social Security Number </td>
    <td> <input> </td>
  </tr>
</table>

问题:如何最好(语义,简单,强大,流畅,可移植)实现上述没有表格.对于初学者,我想一个天真的实现使用第一列的固定列宽,但是对于动态生成的内容可以有iffy结果.在答案中包括你的方法的优点/缺点会很好.

PS另一个我很想知道的是垂直居中,但是jakpsatweb.cz很好地解决了这个问题.

编辑:scunlife提出了一个很好的例子,说明为什么我没有仔细考虑这个问题.表可以同时对齐多个列.问题仍然存在(我希望看到用于对齐/布局的不同CSS技术) - 虽然可以处理他的解决方案？更多涉及的例子绝对是首选.

我目前正在使用表来设计我的时间表 - 但我听说最好远离Web开发中的表格,因为它很少被建议.因此,我想知道是否有人可以规定更好的方法来实施我的时间表？到目前为止,我尝试过使用div几乎没有成功.

这是我正在使用的代码,可以在这里找到一个jsfiddle http://jsfiddle.net/s2ZgT/:

<div id="grid">
    <table width="100%" cellspacing="0" cellpadding="0">
        <tbody>
            <tr class="gridHeader">
                <td>&nbsp;</td>
                <td class="underline">09:00</td>
                <td class="underline">10:00</td>
                <td class="underline">11:00</td>
                <td class="underline">12:00</td>
                <td class="underline">13:00</td>
                <td class="underline">14:00</td>
                <td class="underline">15:00</td>
                <td class="underline">16:00</td>
                <td class="underline">17:00</td>
            </tr>
            <tr id="mon">
                <td class="gridSide">Mon</td>
                <td class="box" id="mon1">&nbsp;</td>
                <td class="box" id="mon2">&nbsp;</td>
                <td class="box" id="mon3">&nbsp;</td>
                <td class="box" id="mon4">&nbsp;</td>
                <td class="box" id="mon5">&nbsp;</td>
                <td class="box" id="mon6">&nbsp;</td>
                <td class="box" id="mon7">&nbsp;</td>
                <td class="box" id="mon8">&nbsp;</td>
                <td class="box" id="mon9">&nbsp;</td>
            </tr>
            <tr id="tue">
                <td class="gridSide">Tue</td>
                <td class="box" id="tue1">&nbsp;</td>
                <td class="box" id="tue2">&nbsp;</td>
                <td class="box" id="tue3">&nbsp;</td> …