jquery – 如何在1页上有2个固定标题？

我有一个带有固定标题的页面,下面是一个表格,我希望有一个固定的表格标题,所以当我滚动时,我总是看到页面标题,然后是下面的表格标题.当我试图修复thead时,这会拧紧thead的列对齐方式.我该如何纠正？

编辑：我的问题是如何让列标题与列对齐？

编辑：另请注意,我需要两个标题…一个在页面顶部,另一个用于表格.

  ottom:black; 
        background: #dedede; 
        position:fixed;
        top:0;
        left:0; 
        width:50%;
        color: #000;
        height: 30px;
    }

    #table{
    width: 50%;
    margin-top: 28px;
    }
    #table_header{
    width: 100%;
    position: fixed;
    }
    .col1{
    width: 40%;
    border: 1px solid #000;
    }
    .col2{
    width: 20%;
    border: 1px solid #000;
    }
    .col3{
    width: 25%;
    border: 1px solid #000;
    }
    .col4{
    width: 15%;
    border: 1px solid #000;
    }
    

最佳答案

如果我抓到你了..我为你做了一个演示http://jsfiddle.net/aV54L/
没有jQuery,没有JavaScript ..仅限CSS

这是代码：

ottom:black; 
    background: #dedede; 
    position:fixed;
    top:0;
    left:0; 
    width:50%;
    color: #000;
    height: 30px;
    z-index:5;
}
.col1{
    width: 40%;
    border: 1px solid #000;
}
.col2{
    width: 20%;
    border: 1px solid #000;
}
.col3{
    width: 25%;
    border: 1px solid #000;
}
.col4{
    width: 15%;
    border: 1px solid #000;
}

#tableHeader {
    width: 50%;
    top: 20px;
    position:fixed;
    background-color: red;
    z-index:10;
}

#table {
    position: relative;
    width: 50%;
    top: 50px;
    background-color: aqua;
    z-index:0;
}

正如我在评论中所说,我认为你的代码的问题是给位置：固定到thead标签.如果不需要,我建议使用演示中显示的两个表,以便正确理解定位.
我认为这不是正如所说的那样的黑客,但它接受像他们工作的东西.我尝试尽可能少地更改原始代码.

原文地址：https://www.jb51.cc/html/426737.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。