WordPress 雑文

【テーブル】隅々まで見えるように。

2017年2月21日

テーブルと言っても、ここでは表のことですよ。

ぼくはF1関連の投稿で表をよく使っていますが、スマホで見たり、PCでもブラウザの幅を狭めていくと右側が見切れてしまい、閲覧することができません。実はつい最近気がつきました。(ダメじゃん
そこで、これをちょこっとだけ改善してみました。

改善と言っても大したことはしていません。以下のように、テーブルの記述に2行書き加えただけです。(赤文字が追加した部分)

<div style="overflow-x: auto;">
<table>

</table>
</div>

この「overflow」プロパティ、いろいろ応用が利くようです。
・overflow-x:scroll:テーブル下にスクロールバー表示
・overflow-y:scroll:
テーブル横にスクロールバー表示

・overflow:scroll:テーブル横・下にスクロールバー表示
・overflow-x:auto:テーブル幅が小さくなると下にスクロールバー表示
・overflow-y:auto:テーブル高さが小さくなると横にスクロールバー表示
・overflow:auto:テーブルサイズが小さくなると横・下にスクロールバー表示
このほかに、visible(内容がはみ出て表示される)やhidden(はみ出た部分は表示されない)といった指定ができるようです。

まぁ、本格的にやるならプラグインを入れるなり、cssに書き込むなりで手がけることになるとは思うのですが、とりあえずの対策として手を入れてみました。いずれは「タイトル行固定」とか「タイトル列固定」なんてのも試してみたいと思います。

にほんブログ村INランキング

にほんブログ村 サッカーブログ FC町田ゼルビアへ
にほんブログ村 車ブログ 車 モータースポーツへ
にほんブログ村 バイクブログ バイクライフへ

にほんブログ村PV

PVアクセスランキング にほんブログ村

Ptengine

-WordPress, 雑文
-,

Copyright© デメキン一期一会 , 2024 All Rights Reserved Powered by AFFINGER5.