CSS - テーブル

CSSだけでスマホ等ではアコーディオンになるレスポンシブな疑似テーブル

Result See the Pen Pure CSS Responsive Accordion Table by kachibito (@kachibito) on CodePen. PCではテーブル、スマホやタ...

テーブルに自動で行数を表示する

Result See the Pen CSS table row numeration by kachibito (@kachibito) on CodePen. tableに行数を表示します。疑似要素にcss-countersで加...

テーブルのセルが空だった場合にハイライトしたり文字を挿入したり

Result See the Pen GQKmMW by kachibito (@kachibito) on CodePen. 5年前にjQueryでテーブル内で空の要素をハイライトさせる、という記事を書いたのを偶然確認したのでCS...

tableで任意の行にマウスホバーしたら他の行をblurさせる

Result See the Pen Fade and Blur on Hover Data Table by kachibito (@kachibito) on CodePen. マウスホバーしてるところ以外をぼかしてホバー中のコ...

position: sticky;でtableを下スクロール時はヘッダ、横スクロール時は最左を固定

Result See the Pen A Simple Responsive Spreadsheet by kachibito (@kachibito) on CodePen. position: sticky;を使ったスプレッドシ...
Ads