CSS サンプル: レスポンシブ対応テーブル (ラベル)

スマートフォンなど狭い幅の場合は列ヘッダを非表示にして行の中にラベルを表示します。(ブラウザの幅を狭くして試してみてください。ラベルは td に data-label という属性を設定して、content: attr(data-label)) で表示する仕組みにしています。

氏名役職部署
山田太郎部長開発部
斎藤次郎取締役無し
木村三郎係長経理部