当前位置:  开发笔记 > 编程语言 > 正文

如何将多个单独的HTML表格与最宽表格的宽度相同

如何解决《如何将多个单独的HTML表格与最宽表格的宽度相同》经验,为你挑选了1个好方法。

问题:我有HTML标记来处理它由嵌套在另一个表中的多个表组成.我希望"内表"都宽度相同.我还希望所有的"内部桌子"都不比自然状态下最宽的"内部桌子"的宽度宽.

希望简单地将所有表格的宽度设置为某个固定百分比,因为我不可能提前知道的最广泛的"内部表"的宽度应该是什么,直到实际生成的HTML页面做.

这是一个视觉示例

来源:https://en.wikipedia.org/wiki/File:Erasene-screen001.png

我希望所有表都与inner-table-zero的宽度相同.目前,没有一个表具有指定的宽度,这就是我喜欢它的方式,因为我希望所有内部表自然地选择默认情况下最宽的表的宽度.

问题:是否有任何CSS或JQuery或Javascript技巧,任何人都知道这将获得所需的样式?

更新:我即将删除这个问题,因为人们似乎想要因为没有充分的理由不想要100%而投票给我.我确实有一个很好的理由......我也不知道直到运行时哪个表将成为"最外层"表(这是一个可能无限深度的递归生成结构).



1> Paolo Bergan..:

我不知道任何HTML/CSS技巧来完成它,但因为你对jQuery开放...

假设你的所有内部表都有一个"内部"类,你可以这样做:

$(document).ready(function() {
    var largest = 0;
    $('table.inner').each(function() {
        var width = $(this)[0].offsetWidth;
        if(width > largest) {
            largest = width;
        }
    }).width(largest);
});

编辑:更新我的使用offsetWidth而不是jQuery的答案width(),因为后者不包括边框,填充或边距.在IE7,FF,Safari,Opera上进行测试,它可以产生预期的效果.

推荐阅读
手机用户2502851955
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有