エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
[CSS] stickyを使ったTableタグのヘッダ(見出し)の固定方法
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
[CSS] stickyを使ったTableタグのヘッダ(見出し)の固定方法
何かしらの集計システムを作った時に、数値が並ぶテーブル表を作ることが増えてきました。 (ていうか毎... 何かしらの集計システムを作った時に、数値が並ぶテーブル表を作ることが増えてきました。 (ていうか毎回作ってる) 他にも内容の文字が多いようなテーブルの場合なんかもありますね。 データベースを表示する時に、テーブルを使うのは一般的なんですよね。 そうしたテーブルって少量のデータ量ならいいんですが、まあまあな規模のWebサービスなどの場合、大きなテーブルになってスクロールを余儀なくされることがあります。 以前は、別途JavascriptでElementを作って対応をしていたけれども、どうやらCSSだけでヘッダ固定処理ができてしまうことがわかったので、そのやり方と解説をブログに残しておくことにします。 スクロールしなければいけないテーブルタグ 次のようなテーブルデータがある場合、これまでは、divタグなどで囲って(wrapして)、その中をoverflow:scrollする簡易処理をしていました。