WordPressのテーマであるArthemiaは便利なテーマではあるが、tableタグのCSSが貧粗なので、Tableがきれいに表現されない。
デフォルトのtableタグの欠点
- 線が表示されない
- 全て左寄せ
最初、tableタグのCSSを直接変更したが、そこをいじると、Widgetのカレンダーのデザインが崩れたので、あらたにclassを追加した。
style.cssに下記のコードを追加する。
表に線を表示する。
幅は100%。
テキストは中央揃え。
[php]
/* tables class追加分 */
.tableclass01 {
border: 1px #ccc solid;
width: 100%;
text-align: center;
border-collapse: separate;
border-spacing: 0;
}
.tableclass01 td {
text-align: center;
border: 1px #ccc solid;
font-weight: normal;
}
.tableclass01 th {
text-align: center;
border: 1px #ccc solid;
font-weight: normal;
}
[/php]
hr>
tabelタグのなかに、class=”tableclass01″で指定する。
border=1を指定しているのは、印刷用に使用しているWP-printプラグインで表示される画面には、CSSの設定が反映されない(線が消えてしまう)ので、記述してある。
[php]