ぼくらの研究

ぼくらのための研究をしていきます。

Stinger5でテーブルの背景色が交互に灰、白になるのを防ぐ方法

      2017/02/26

表の行色違い

備忘録的に書いておきます。

 

 

WordPressの管理画面からテーマ編集、style.cssを開きます。

このスタイルシートの

.post table tr:nth-child(even) {
 background-color:#f3f3f3;
 }

の部分が変更箇所です。
※.post table tr:nth-child(even)は1箇所しかないのでこれで検索すれば見つかります。

ここを

 .post table tr:nth-child(even) { background-color:#ffffff; } 

としてもいいんですが、これだとブログの背景が白(#ffffff)以外に指定している時は背景と違う色になってしまうのと、ふつうの時は大丈夫でも引用タグとかで囲った時に今度は引用部分の灰色背景と違う色になってしまって結局表の灰色と白の行が交互に表示されてしまうのがあるので少し微妙。(引用タグ以外でも背景色を設定しているcssクラスで囲った時にはこの現象が起きます)

これを解決するにはそもそも表の背景色を何も指定しなきゃいい。ということで、

 .post table tr:nth-child(even) { background-color:transparent; } 

というふうにするのが一番いい感じになるのではないでしょうか。

こうやってtransparentで透過すればブログにどんなカラーを背景色に設定していてもそれと同じ色になるし、表の行ごとに色が変わる心配もない。※post table tr:nth-child(even)自体をどうこうするのは面倒なのでやめときました

以上、ご参考になれば幸い。