English 中文(简体)
如何冻结 html 表格的第一列和页眉
原标题：How can we freeze first column and header in html table

我没有任何好的解决方案 来固定一张表格的头和柱子 其类型结构如下:

 <table>    
    <thead>        
        <tr>            
            <th colspan="4">Current</th>            
            <th colspan="4">New/Requested</th>        
        </tr>        
        <tr>            
            <th nowrap="nowrap">RSD &nbsp;&nbsp;&nbsp;&nbsp;</th>           
            <th nowrap="nowrap">CRSD &nbsp;&nbsp;&nbsp;&nbsp;</th>            
            <th nowrap="nowrap">MSD &nbsp;&nbsp;&nbsp;&nbsp;</th>            
            <th nowrap="nowrap">Open QTY &nbsp;&nbsp;&nbsp;&nbsp;</th>            
            <th nowrap="nowrap">CRD &nbsp;&nbsp;&nbsp;&nbsp;</th>            
            <th nowrap="nowrap">CRSD &nbsp;&nbsp;&nbsp;&nbsp;</th>           
            <th nowrap="nowrap">MSD &nbsp;&nbsp;&nbsp;&nbsp;</th>            
            <th nowrap="nowrap">Open QTY &nbsp;&nbsp;&nbsp;&nbsp;</th>            
            <th nowrap="nowrap">Action</th>            
            <th nowrap="nowrap">Reason</th>            
            <th nowrap="nowrap">Action Code Status </th>        
        </tr>
    </thead>    
    <tbody>         
        <tr>             
            <td></td>              
            <td></td>                
            .....plenty of rows        
        </tr>     
    </tbody> 
</table>

and getting populated through ajax call, please provide a good solution in which I can use my previous css as well. (mean it will not require any css changes).

问题回答

使用 css 来解决问题。

为所有需要的列创建第一个表格,只设置第一个固定列值,其余的则在其中创建另一个表格。

对于内表,给一个特定的宽度和高度,给一个 cs 溢出: scroll;

也许这个链接能帮助您理解我所说的“href=”“http://www.w3schools.com/csref/tryit.asp?filename=trycss_overflow” rel=“no follow”>http://www.w3schololks.com/csref/tryit.asp?filename=trycss_overflow

时间：2012-06-09 21:31:26

您可以像这样尝试

<table>    
    <thead>        
        <tr>            
            <th colspan="4">Current</th>            
            <th colspan="4">New/Requested</th>        
        </tr>        
        <tr>            
            <th nowrap="nowrap">RSD aaaa</th>           
            <th nowrap="nowrap">CRSD aaaa</th>            
            <th nowrap="nowrap">MSD aaaa</th>            
            <th nowrap="nowrap">Open QTY aaaa</th>            
            <th nowrap="nowrap">CRD aaaa</th>            
            <th nowrap="nowrap">CRSD aaaa</th>           
            <th nowrap="nowrap">MSD aaaa</th>            
            <th nowrap="nowrap">Open QTY aaaa</th>            
            <th nowrap="nowrap">Action</th>            
            <th nowrap="nowrap">Reason</th>            
            <th nowrap="nowrap">Action Code Status </th>        
        </tr>
    </thead>
</table>
<div style= height: 150px; overflow: scroll; >
<table> 
    <tbody>         
        <tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr><tr>             
            <td>a</td>              
            <td>a</td>         
        </tr>     
    </tbody> 
</table>
</div>
时间：2012-05-23 04:28:28


上一篇：
下一篇：


相关问题
selected text in iframe

How to get a selected text inside a iframe. I my page i m having a iframe which is editable true. So how can i get the selected text in that iframe.

时间：2009-11-13 04:26:50 回答：3 展示：1
How to fire event handlers on the link using javascript

I would like to click a link in my page using javascript. I would like to Fire event handlers on the link without navigating. How can this be done? This has to work both in firefox and Internet ...

时间：2009-11-13 04:03:02 回答：2 展示：1
How to Add script codes before the </body> tag ASP.NET

Heres the problem, In Masterpage, the google analytics code were pasted before the end of body tag. In ASPX page, I need to generate a script (google addItem tracker) using codebehind ClientScript ...

时间：2009-11-13 03:31:36 回答：3 展示：1
Clipboard access using Javascript - sans Flash?

Is there a reliable way to access the client machine s clipboard using Javascript? I continue to run into permissions issues when attempting to do this. How does Google Docs do this? Do they use ...

时间：2009-11-09 14:57:38 回答：8 展示：1
javascript debugging question

I have a large javascript which I didn t write but I need to use it and I m slowely going trough it trying to figure out what does it do and how, I m using alert to print out what it does but now I ...

时间：2009-11-09 14:29:27 回答：2 展示：1
Parsing date like twitter

I ve made a little forum and I want parse the date on newest posts like twitter, you know "posted 40 minutes ago ","posted 1 hour ago"... What s the best way ? Thanx.

时间：2009-11-09 14:21:27 回答：2 展示：1
热门标签

友情链接

Allggapp Alljchome-教程家园 mvfinale.com-影视剧情大结局大全