CSS-Tableのヘッダ・フッタ・列の固定(縦横スクロールも)
やりたかったのは、縦・横スクロール付きのヘッダ固定テーブル。(ヘッダ1行・ヘッダ複数行、列固定は無し)で、
こちらの記事がとても参考になったのでメモ。
これを参考にして自分アレンジしたのが↓↓
※スクロールバーの位置がちょっとおかしい(セルに少しかぶる)のでもうちょっと調整した方が良いかも
▼css(自作サンプル)
▼script(要-jQuery)
▼HTML
H1 | H2 | H3 | H4 | H5 |
---|---|---|---|---|
F1 | F2 | F3 | F4 | F5 |
11 | 12 | 13 | 14 | 15 |
21 | 22 | 23 | 24 | 25 |
31 | 32 | 33 | 34 | 35 |
41 | 42 | 43 | 44 | 45 |
11 | 12 | 13 | 14 | 15 |
21 | 22 | 23 | 24 | 25 |
31 | 32 | 33 | 34 | 35 |
41 | 42 | 43 | 44 | 45 |
11 | 12 | 13 | 14 | 15 |
21 | 22 | 23 | 24 | 25 |
31 | 32 | 33 | 34 | 35 |
41 | 42 | 43 | 44 | 45 |