固定表头和列

 

  1 < html >
  2 < head >
  3      < meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >
  4      < title > 固定表头和列 </ title >
  5      < style >
  6        .FixedTitleRow
  7        {}{
  8            position: relative; 
  9            top: expression(this.offsetParent.scrollTop); 
 10            z-index: 10;
 11            background-color: #E6ECF0;
 12        }
 13        
 14        .FixedTitleColumn
 15        {}{
 16            position: relative; 
 17            left: expression(this.parentElement.offsetParent.scrollLeft);
 18        }
 19        
 20        .FixedDataColumn
 21        {}{
 22            position: relative;
 23            left: expression(this.parentElement.offsetParent.parentElement.scrollLeft);
 24            background-color: #E6ECF0;
 25        }
 26     </ style >
 27 </ head >
 28 < body >
 29     < div  id ="scrollDiv"  style ="width: 300px; overflow: auto; cursor: default; display: inline;
 30         position: absolute; height: 200px;" >
 31          < table  id ='accountTable'  width ='500'  height ='330'  cellpadding ='0'  cellspacing ='0'
 32              style ='table-layout:  auto' bordercolor ='lightgrey' >
 33              < tbody >
 34                  < tr  class ="FixedTitleRow" >
 35                      < td  class ="FixedTitleColumn" >
 36                         姓名 </ td >
 37                      < td  class ="FixedTitleColumn" >
 38                         单位 </ td >
 39                      < td   class ="FixedTitleColumn" >
 40                         工资 </ td >
 41                      < td >
 42                         Descirption0 </ td >
 43                      < td >
 44                         TOL0 </ td >
 45                      < td >
 46                         XS0 </ td >
 47                      < td  >
 48                         SS0 </ td >
 49                      < td >
 50                         MS0 </ td >
 51                      < td >
 52                         DS0 </ td >
 53                      < td >
 54                         BS0 </ td >
 55                      < td >
 56                         XL0 </ td >
 57                      < td >
 58                         ML0 </ td >
 59                      < td >
 60                         DL0 </ td >
 61                      < td >
 62                         EM0 </ td >
 63                      < td >
 64                         BM0 </ td >
 65                  </ tr >
 66                  < tr >
 67                      < td  class ="FixedDataColumn" >
 68                         赖文华 </ td >
 69                      < td  class ="FixedDataColumn" >
 70                         北京中油瑞飞 </ td >
 71                      < td  >
 72                         9999RMB </ td >
 73                      < td  >
 74                         88 </ td >
 75                      < td  >
 76                         88 </ td >
 77                      < td >
 78                         22 </ td >
 79                      < td >
 80                         22 </ td >
 81                      < td >
 82                         22 </ td >
 83                      < td >
 84                         22 </ td >
 85                      < td >
 86                         22 </ td >
 87                      < td >
 88                         22 </ td >
 89                      < td >
 90                         22 </ td >
 91                      < td >
 92                         22 </ td >
 93                      < td >
 94                         22 </ td >
 95                      < td >
 96                         22 </ td >
 97                  </ tr >
 98                  < tr >
 99                      < td  class ="FixedDataColumn" >
100                         赖文华 </ td >
101                      < td  class ="FixedDataColumn" >
102                         北京中油瑞飞 </ td >
103                      < td  >
104                         9999RMB </ td >
105                      < td  >
106                         88 </ td >
107                      < td  >
108                         88 </ td >
109                      < td >
110                         22 </ td >
111                      < td >
112                         22 </ td >
113                      < td >
114                         22 </ td >
115                      < td >
116                         22 </ td >
117                      < td >
118                         22 </ td >
119                      < td >
120                         22 </ td >
121                      < td >
122                         22 </ td >
123                      < td >
124                         22 </ td >
125                      < td >
126                         22 </ td >
127                      < td >
128                         22 </ td >
129                  </ tr >
130   < tr >
131                      < td  class ="FixedDataColumn" >
132                         赖文华 </ td >
133                      < td  class ="FixedDataColumn" >
134                         北京中油瑞飞 </ td >
135                      < td  >
136                         9999RMB </ td >
137                      < td  >
138                         88 </ td >
139                      < td  >
140                         88 </ td >
141                      < td >
142                         22 </ td >
143                      < td >
144                         22 </ td >
145                      < td >
146                         22 </ td >
147                      < td >
148                         22 </ td >
149                      < td >
150                         22 </ td >
151                      < td >
152                         22 </ td >
153                      < td >
154                         22 </ td >
155                      < td >
156                         22 </ td >
157                      < td >
158                         22 </ td >
159                      < td >
160                         22 </ td >
161                  </ tr >
162   < tr >
163                      < td  class ="FixedDataColumn" >
164                         赖文华 </ td >
165                      < td  class ="FixedDataColumn" >
166                         北京中油瑞飞 </ td >
167                      < td  >
168                         9999RMB </ td >
169                      < td  >
170                         88 </ td >
171                      < td  >
172                         88 </ td >
173                      < td >
174                         22 </ td >
175                      < td >
176                         22 </ td >
177                      < td >
178                         22 </ td >
179                      < td >
180                         22 </ td >
181                      < td >
182                         22 </ td >
183                      < td >
184                         22 </ td >
185                      < td >
186                         22 </ td >
187                      < td >
188                         22 </ td >
189                      < td >
190                         22 </ td >
191                      < td >
192                         22 </ td >
193                  </ tr >
194   < tr >
195                      < td  class ="FixedDataColumn" >
196                         赖文华 </ td >
197                      < td  class ="FixedDataColumn" >
198                         北京中油瑞飞 </ td >
199                      < td  >
200                         9999RMB </ td >
201                      < td  >
202                         88 </ td >
203                      < td  >
204                         88 </ td >
205                      < td >
206                         22 </ td >
207                      < td >
208                         22 </ td >
209                      < td >
210                         22 </ td >
211                      < td >
212                         22 </ td >
213                      < td >
214                         22 </ td >
215                      < td >
216                         22 </ td >
217                      < td >
218                         22 </ td >
219                      < td >
220                         22 </ td >
221                      < td >
222                         22 </ td >
223                      < td >
224                         22 </ td >
225                  </ tr >
226   < tr >
227                      < td  class ="FixedDataColumn" >
228                         赖文华 </ td >
229                      < td  class ="FixedDataColumn" >
230                         北京中油瑞飞 </ td >
231                      < td  >
232                         9999RMB </ td >
233                      < td  >
234                         88 </ td >
235                      < td  >
236                         88 </ td >
237                      < td >
238                         22 </ td >
239                      < td >
240                         22 </ td >
241                      < td >
242                         22 </ td >
243                      < td >
244                         22 </ td >
245                      < td >
246                         22 </ td >
247                      < td >
248                         22 </ td >
249                      < td >
250                         22 </ td >
251                      < td >
252                         22 </ td >
253                      < td >
254                         22 </ td >
255                      < td >
256                         22 </ td >
257                  </ tr >
258   < tr >
259                      < td  class ="FixedDataColumn" >
260                         赖文华 </ td >
261                      < td  class ="FixedDataColumn" >
262                         北京中油瑞飞 </ td >
263                      < td  >
264                         9999RMB </ td >
265                      < td  >
266                         88 </ td >
267                      < td  >
268                         88 </ td >
269                      < td >
270                         22 </ td >
271                      < td >
272                         22 </ td >
273                      < td >
274                         22 </ td >
275                      < td >
276                         22 </ td >
277                      < td >
278                         22 </ td >
279                      < td >
280                         22 </ td >
281                      < td >
282                         22 </ td >
283                      < td >
284                         22 </ td >
285                      < td >
286                         22 </ td >
287                      < td >
288                         22 </ td >
289                  </ tr >
290   < tr >
291                      < td  class ="FixedDataColumn" >
292                         赖文华 </ td >
293                      < td  class ="FixedDataColumn" >
294                         北京中油瑞飞 </ td >
295                      < td  >
296                         9999RMB </ td >
297                      < td  >
298                         88 </ td >
299                      < td  >
300                         88 </ td >
301                      < td >
302                         22 </ td >
303                      < td >
304                         22 </ td >
305                      < td >
306                         22 </ td >
307                      < td >
308                         22 </ td >
309                      < td >
310                         22 </ td >
311                      < td >
312                         22 </ td >
313                      < td >
314                         22 </ td >
315                      < td >
316                         22 </ td >
317                      < td >
318                         22 </ td >
319                      < td >
320                         22 </ td >
321                  </ tr >
322   < tr >
323                      < td  class ="FixedDataColumn" >
324                         赖文华 </ td >
325                      < td  class ="FixedDataColumn" >
326                         北京中油瑞飞 </ td >
327                      < td  >
328                         9999RMB </ td >
329                      < td  >
330                         88 </ td >
331                      < td  >
332                         88 </ td >
333                      < td >
334                         22 </ td >
335                      < td >
336                         22 </ td >
337                      < td >
338                         22 </ td >
339                      < td >
340                         22 </ td >
341                      < td >
342                         22 </ td >
343                      < td >
344                         22 </ td >
345                      < td >
346                         22 </ td >
347                      < td >
348                         22 </ td >
349                      < td >
350                         22 </ td >
351                      < td >
352                         22 </ td >
353                  </ tr >
354   < tr >
355                      < td  class ="FixedDataColumn" >
356                         赖文华 </ td >
357                      < td  class ="FixedDataColumn" >
358                         北京中油瑞飞 </ td >
359                      < td  >
360                         9999RMB </ td >
361                      < td  >
362                         88 </ td >
363                      < td  >
364                         88 </ td >
365                      < td >
366                         22 </ td >
367                      < td >
368                         22 </ td >
369                      < td >
370                         22 </ td >
371                      < td >
372                         22 </ td >
373                      < td >
374                         22 </ td >
375                      < td >
376                         22 </ td >
377                      < td >
378                         22 </ td >
379                      < td >
380                         22 </ td >
381                      < td >
382                         22 </ td >
383                      < td >
384                         22 </ td >
385                  </ tr >
386              </ tbody >
387          </ table >
388      </ div >
389
390 </ body >
391 </ html >
392

转载于:https://www.cnblogs.com/GavinCome/archive/2008/07/17/1245395.html