縦横スクロールのサンプル
縦横とも一部を固定、一部をスクロール可能にするサンプルです。
一応完成していますが、各列の幅の定義をCSSの中に書く必要があります。
IE9以降、この定義は「nth-child」を使って簡潔に書けるようになったため、
このサンプルの形でも結構実用になると思います。
IE11,Chrome40で確認しました。(2015-02-28)
| 00100 | 札幌 |
| 00102 | 函館 |
| 00200 | 仙台 |
| 00300 | さいたま |
| 00310 | 新宿 |
| 00320 | 銀座 |
| 00330 | 横浜 |
| 地域 | 所在地 | 従業員数 | カレンダー |
コード1 | コード2 | コード3 |
| 1 | 札幌市中央区北１４条西２丁目９−９ | 40 | AAA |
コード1未使用 | コード2未使用 | コード3未使用 |
| 1 | 北海道函館市海岸町９−９９ | 40 | AAA |
コード1未使用 | コード2未使用 | コード3未使用 |
| 2 | 仙台市青葉区一番町9-99-99 | 40 | AAA |
コード1未使用 | コード2未使用 | コード3未使用 |
| 3 | さいたま市浦和区高砂9-99-99 | 40 | AAA |
コード1未使用 | コード2未使用 | コード3未使用 |
| 3 | 新宿区歌舞伎町9-99-99 | 40 | AAA |
コード1未使用 | コード2未使用 | コード3未使用 |
| 3 | 東京都中央区銀座9-99-99 | 40 | AAA |
コード1未使用 | コード2未使用 | コード3未使用 |
| 3 | 横浜市中区海岸通9丁目99 | 40 | AAA |
コード1未使用 | コード2未使用 | コード3未使用 |