§ ITPOW >> 文档 >> XHTML

table-总结

作者:vkvi 来源:ITPOW(原创) 日期:2008-9-4

在 Firefox + XHTML + collapse 环境下,有些问题较为复杂,请先参见:table-Firefox + XHTML + collapse 边框与宽度(补)

table 的样式宽度为实际宽度,不受 td 等宽度的影响。

边框

  • table 样式边框只对表格外围有效,border 属性边框对单元格有效。
  • border 属性边框较为粗大,border-collapse:collapse; 可以让它细一点,但在各浏览器中也有轻微差别,故不推荐用 border 属性边框,用 td 的边框代替。

单元格边框分配

  • 未指定 table 的样式宽度时,td 边框不占 td 样式宽度。
  • 指定 table 样式宽度时(只讨论各 td 样式宽度恰好等于 table 样式宽度的情况)。
    • 把所有边框宽度独立出来,然后根据各 td 的宽度分配应该“承担”的边框宽度。
    • 如果无法均匀分配(无法整除)边框的“承担”,则靠左的边框承担较少部分。

table 样式边框与 border 属性边框重叠问题

  • 未指定 border-collapse 时,不重叠。
    • 样式边框在外。
  • 指定 border-collapse 为 collapse 时,重叠。
    • 样式边框重叠 border 属性边框。
      • FF 是将重叠延伸到 border 属性边框。
      • IE 的重叠仅限于样式边框。

table 与 td 样式边框重叠问题

  • 未指定 border-collapse 时,不重叠。
  • 指定 border-collapse 为 collapse 时,重叠。
    • FF 是 td 重叠 table。
    • IE 是 table 重叠 td。

td 与 td 样式边框重叠问题

  • 未指定 border-collapse 时,不重叠。
  • 指定 border-collapse 为 collapse 时,重叠。
    • 左边单元格右边框重叠右边单元格左边框。
相关文章