在 W3C 规范中 position 是可以使用在任何元素上的,但 position:relative 却有部分例外:

The effect of ‘position:relative’ on table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell, and table-caption elements is undefined.

经测试,在浏览器(IE 除外)中给 table 定义 position:relative 属性是无效的。如果的确需要在表格中使用该属性,建议在单元格中嵌套一个 div 元素,再在其上设置 position:relative 属性来模拟。



共有16 条评论

  1. 1. 头像 old9

    undefined 我个人理解是未定义的意思,印象中规范还有其他一些地方出现过这个词。
    嗯,就是说我不规定有什么效果,浏览器制造商自己去理解,爱什么效果什么效果……

  2. 2. 头像 怿飞

    @old9 应该是你说的大意,不过既然是规范,应该统一定义,如果各自发挥带来的后果只会更复杂,呵呵
    貌似好久在网上没见你的影子了^^

  3. 3. 头像 找乐子

    不错,有学了一招,不过好久没有用table了

  4. 4. 头像 太阳

    那是因为table默认的display不是block。display:block后就可以了

  5. 5. 头像 old9

    暑假,比较悠闲,赫赫

  6. 6. 头像 yamijia

    怿飞又发表新文章了啊,呵呵

  7. 7. 头像 大猫

    IE …freak

  8. 8. 头像 闲耘

    觉得@old9的理解是正确的,标准也不一定面面俱到,完全钉死,Cpp/C/ECMAScript标准的规范中也有一些是为定义的。

  9. 9. 头像 八度社区

    你的意思是说在table里面外包围一个div吗?

  10. 10. 头像 怿飞

    @八度社区 是在td中包含一个div

  11. 11. 头像 fanxiaowen

    position:relative 只对DIV有效。我是这么理解的。

  12. 12. 头像 火德

    @fanxiaowen 应该是对table无效,并不仅仅作用于div,像ul、li、dl、dt、dd、span等众多标签都是有效果的。
    在给table中的元素用CSS设置单行字符截断(省略,后面带三个点)的时候这点很讨厌,通常都要新增div或者将a标签block后来处理,不知道有没有更好的方法。

  13. 13. 头像 火德

    呃,貌似跑题了,和正文没有多大关系~

  14. 14. 头像 卢子嘉

    不错 学习了

  15. 15. 头像 阿飞

    受教,以前还没有注意到这样的用法,谢谢分享。

  16. 16. 头像 天室

    兼容兼容,头都大了

发表评论

(必填)

(必填,会为您保密)

评论仅支持“a、abbr、strong、em、blockquote、code”几个简单的标签