リファインってクールなテンプレートですが、普通に表を書くと、左右の線が(ボーダーが切れちゃってませんか?)
これってちょっと使いにくい。
こんな感じになっちゃいます。
普通に書くと~
左右が切れとる。(デフォルトでなくなっとる)
見出し | 見出し | |
---|---|---|
a | b | c |
d | e | f |
g | h | i |
j | k | l |
トシが作った今後ここで使っていく表は~
見出し | 見出し | |
---|---|---|
a | b | c |
d | e | f |
g | h | i |
j | k | l |
ということで、今後このブログで使っていく用に、表のテンプレをメモ。
簡単に設置できますので、よかったら使ってくださいね。
まずCSSを書いておけば、あとは下のタグをコピって記事に貼り付けるだけです。
まずはCSSを書いておく
これね。こんだけ書くだけで下の2つの表が使えます。
/*オリジナルテーブルthはいつもセンター*/ .originTable{ width:100%; border-collapse: collapse; } .originTable th{ border: solid #ccc 1px; background-color:#f3f3f3; text-align:center; } .originTable th,.originTable td{ border: solid #ccc 1px; padding:8px 15px;} .centerTable td{ text-align:center;} .leftTable td{ text-align:left;}
これを書く場所はココ。

テーマ編集をクリックしたらずっと右下の方、
custom.css(これは自分で自由にカスタムできるCSS)に追記します。

これができたら、準備OK。あとはこのタグを使うだけです。
全部中央寄せ~
見出し | 見出し | |
---|---|---|
a | b | c |
d | e | f |
g | h | i |
j | k | l |
全部中央寄せ~のタグはこれ↓
<table border="1" class="originTable leftTable"> <tr> <th></th> <th>見出し</th> <th>見出し</th> </tr> <tr> <td>a</td> <td>b</td> <td>c</td> </tr> <tr> <td>d</td> <td>e</td> <td>f</td> </tr> <tr> <td>g</td> <td>h</td> <td>i</td> </tr> <tr> <td>j</td> <td>k</td> <td>l</td> </tr> </table>
左寄せ~
見出し | 見出し | |
---|---|---|
a | b | c |
d | e | f |
g | h | i |
j | k | l |
全部左寄せ~のタグはこれ↓
<table border="1" class="originTable leftTable"> <tr> <th></th> <th>見出し</th> <th>見出し</th> </tr> <tr> <td>a</td> <td>b</td> <td>c</td> </tr> <tr> <td>d</td> <td>e</td> <td>f</td> </tr> <tr> <td>g</td> <td>h</td> <td>i</td> </tr> <tr> <td>j</td> <td>k</td> <td>l</td> </tr> </table>
もし使えねーぞ!
ってことであれば教えてください^^;
自分はいまのとこ使えてます。