Question

我有一个页面中有多个<table>的jsp。我只希望一个特定的桌子具有固定的高度，并且具有可滚动的<tbody>和固定的<thead>。
为此，我已经编写了一个自定义CSS作为类，以便我可以在该特定表中使用它。但它不起作用。
这是CSS：

.scroll-tbody{
    display: block;
    height: 460px;
    overflow-y: auto;
}

这是JSP片段：

<table class="table table-hover table-condensed">
    <thead>
        <tr>
            <td><b>&nbsp &nbsp  Name</b></td>
            <td><b>Phone</b></td>
            <td><b>Total Exp.</b></td>
            <td><b>Location</b></td>
            <td><b>Profile Type</b></td>
            <td><b>Domain</b></td>
            <td><b>Assigned To</b></td>
            <td><b>Status</b></td>
            <td><b>Date</b></td>
        </tr>
    </thead>
    <tbody class="scroll-tbody"> <!-- HERE IS THE CUSTOM CSS FOR SCROLLING -->
    <%
        if(fullList.size()>0)
        {
            Iterator itr = fullList.iterator();
            while(itr.hasNext())
            {
                FileService fs = new FileService();
                File prf = (File)itr.next();
                String prfData = prf.getAbsolutePath() + "#";
                prfData += fs.readData(prf.getAbsolutePath(),"","profiledata");
                prfData = prfData.replace("\\","/");
                String[] data = prfData.split("#");
                String name = data[1].replace("_"," ");
                String phone = data[2];
                String totExp = data[3];
                String location = data[5];
                String prfType = data[6];
                String domain = data[7];
                String assignedTo = data[8];
                String status = data[9];
                String prfDate = data[12];
                prfData = prfData.replace("'","\\'");
                prfData = prfData.replace("\"","\\'");
                prfData = prfData.replace("\r\n","^");
                System.out.println("---->JSP Data: "+prfData+"\n");
                session.setAttribute("dataToEdit",prfData);%>
                <tr>
                    <td><a data-toggle="modal" data-target="#editProfileModal" onClick="getData('<%=prfData%>')"><i class="fa fa-fw fa-file"></i><font size="2"><%=name%></font></a></td>
                    <td><font size="2"><%=phone%></font></td>
                    <td><font size="2"><%=totExp%></font></td>
                    <td><font size="2"><%=location%></font></td>
                    <td><font size="2"><%=prfType%></font></td>
                    <td><font size="2"><%=domain%></font></td>
                    <td><font size="2"><%=assignedTo%></font></td>
                    <td><font size="2"><%=status%></font></td>
                    <td><font size="2"><%=prfDate%></font></td>
                </tr>
        <%  }   
        } %>
    </tbody>
</table>

我不想写像table{...} thead{...} tbody{...}那样的CSS，因为它会影响该页面中的所有表格。
我错过了什么吗？提前谢谢。

html可滚动tbody固定thead不工作

0 个答案: