table固定表頭滾動

一、table固定表頭滾動（不相容ie）  使用scrolltop監聽滾動   如下例

1、html

<

div 
class
="tabflow"
id="flowtable-cont"
>
<
table
>
<
thead
><
tr><
th>年度
th><
th>起降架次(萬架)
th><
th>旅客吞吐(萬人)
th><
th>貨郵吞吐(萬噸)
th>
tr>
thead
>
<
tbody
>
<
tr><
td>2011
td><
td>512
td><
td>600
td><
td>376
td>
tr>
<
tr><
td>2012
td><
td>504
td><
td>593
td><
td>397
td>
tr>
<
tr><
td>2013
td><
td>562
td><
td>562
td><
td>381
td>
tr>
<
tr><
td>2014
td><
td>705
td><
td>464
td><
td>302
td>
tr>
<
tr><
td>2015
td><
td>784
td><
td>443
td><
td>374
td>
tr>
<
tr><
td>2016
td><
td>645
td><
td>504
td><
td>415
td>
tr>
<
tr><
td>2017
td><
td>534
td><
td>534
td><
td>432
td>
tr>
<
tr><
td>2018
td><
td>375
td><
td>582
td><
td>460
td>
tr>
<
tr><
td>2019
td><
td>397
td><
td>621
td><
td>442
td>
tr>
tbody
>
table
>
div>

.tabflow.tabflow table.tabflow table tr.tabflow table thead.tabflow table tbody tr:nth-child(2n+1).tabflow table tbody tr td

window.onload = function

()     tableflow.addeventlistener('scroll',scrollhandle);   //監聽scroll事件
}

css  

tabletabletable trtable theadtable thead tr thtable thead tr th:first-childtable tbodytable tbody tr:nth-child(2n+1)table tbody tr tdtable tbody tr td:first-child

Table實現表頭固定 內容滾動

序號內容 1我只是用來測試的 2我只是用來測試的 3我只是用來測試的 4我只是用來測試的 table head table body table head table,table body table table body table tr nth child 2n 1 其實關鍵之處在於 1 使用了...

table固定表頭

html中table樣式固定表頭，下面的內容滾動 html 終端sn號 會員名稱 會員 繫結狀態 啟用狀態 入庫時間 終端sn號 會員名稱 會員 繫結狀態 啟用狀態 入庫時間 終端sn號 會員名稱 會員 繫結狀態 啟用狀態 入庫時間 終端sn號 會員名稱 會員 繫結狀態 啟用狀態 入庫時間 終端sn...

table中head表頭固定，body滾動

序號內容 1我只是用來測試的 2我只是用來測試的 3我只是用來測試的 4我只是用來測試的 5我只是用來測試的 6我只是用來測試的 7我只是用來測試的 8我只是用來測試的 9我只是用來測試的 10我只是用來測試的 11我只是用來測試的 12我只是用來測試的 13我只是用來測試的 14我只是用來測試的 ...