このサイトは、WordPressテーマ「スワロー」を使っています。いました。
表をHTMLで作ってみます。
コピペで、簡単に表を作ることができますよ～。
tr・・・行
td・・・セル（データセル）
th・・・見出しセル。一般的なブラウザで太字、センター。
3行表
例えば、このような３行表。
| 1 | データ1 | データ2 |
| 2 | データ1 | データ2 |
| 3 | データ1 | データ2 |
この表を作るには、
これを コピペ ↓
<tr>
<td>1</td>
<td>データ1</td>
<td>データ2</td>
</tr>
<tr>
<td>2</td>
<td>データ1</td>
<td>データ2</td>
</tr>
<tr>
<td>3</td>
<td>データ1</td>
<td>データ2</td>
</tr>
</table>
↑これを、カスタムHTMLに張り付けてください。任意の文字をいれてください。
外枠の太さ指定
border=” ” で外枠の太さを指定できます。
上の表の場合 border=”2″ の２にしています。
<table border=”2″ > ～ </table> の border=”2″ を消し
<table > ～ </table> にすると ↓ こうなります。
| 1 | データ1 | データ2 |
| 2 | データ1 | データ2 |
| 3 | データ1 | データ2 |
線が消えるはず？ですが、ワードプレス テーマ（スワロー）では、こうなりました。
すっきり綺麗に見えますね。
この表を作るのは、これを コピペ ↓
<tr>
<td>1</td>
<td>データ1</td>
<td>データ2</td>
</tr>
<tr>
<td>2</td>
<td>データ1</td>
<td>データ2</td>
</tr>
<tr>
<td>3</td>
<td>データ1</td>
<td>データ2</td>
</tr>
</table>
↑これを、カスタムHTMLに張り付けてください。
3行表 縦タイトル太 色付き
| 1 | データ1 | データ2 |
|---|---|---|
| 2 | データ1 | データ2 |
| 3 | データ1 | データ2 |
th は、見出しセルです。一般的なブラウザで太字、センターになるようですが、ここでは色がつきました。センターにはなっていませんね。
この表を作るには、
これを コピペ ↓
<tr>
<th>1</th>
<td>データ1</td>
<td>データ2</td>
</tr>
<tr>
<th>2</th>
<td>データ1</td>
<td>データ2</td>
</tr>
<tr>
<th>3</th>
<td>データ1</td>
<td>データ2</td>
</tr>
</table>
もちろん、すきなだけ行を増やすことができます。
4行表 縦タイトル太
| 1 | データ1 | データ2 |
|---|---|---|
| 2 | データ1 | データ2 |
| 3 | データ1 | データ2 | 4 | データ1 | データ2 |
この表を作るには、
これを コピペ ↓
<tr>
<th>1</th>
<td>データ1</td>
<td>データ2</td>
</tr>
<tr>
<th>2</th>
<td>データ1</td>
<td>データ2</td>
</tr>
<tr>
<th>3</th>
<td>データ1</td>
<td>データ2</td>
</tr>
<th>4</th>
<td>データ1</td>
<td>データ2</td>
</table>
↑これを、カスタムHTMLに張り付けてください。
border=” ” で外枠の太さを指定できます。ここでは、2にしています。
行を増やすには
行を増やしたい時は、このようにこれ↓を足すとOK。
<td>データ1</td>
<td>データ2</td>
<th>4</th>の数字は行になります。
↑これを、カスタムHTMLに張り付けてください。
3行表 横タイトル太 色付き
th・・・見出しセル。一般的なブラウザで太字、センターになるようですがセンターにならず、色がつきました。
| 1 | 2 | 3 |
|---|---|---|
| データ1 | データ2 | データ3 |
| データ1-2 | データ2-2 | データ3-2 |
この表を作るには、
これを コピペ ↓
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
</tr>
<tr>
<td>データ1</td>
<td>データ2</td>
<td>データ3</td>
</tr>
<tr>
<td>データ1-2</td>
<td>データ2-2</td>
<td>データ3-2</td>
</tr>
</table>
↑これを、カスタムHTMLに張り付けてください。
border=” ” で外枠の太さを指定できます。ここでは、3にしています。
4行表 横タイトル太
| 1 | 2 | 3 | 4 |
|---|---|---|---|
| データ1 | データ2 | データ3 | データ4 |
| データ1-2 | データ2-2 | データ3-2 | データ4-2 |
↑これを、カスタムHTMLに張り付けてください。
この表を作るには、
これを コピペ ↓
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
<tr>
<td>データ1</td>
<td>データ2</td>
<td>データ3</td>
<td>データ4</td>
</tr>
<tr>
<td>データ1-2</td>
<td>データ2-2</td>
<td>データ3-2</td>
<td>データ4-2</td>
</tr>
</table>
↑これを、カスタムHTMLに張り付けてください。
border=” ” で外枠の太さを指定できます。ここでは、3にしています。
行を増やすには
<td>データ4</td>
<td>データ4-2</td>
↑これを、カスタムHTMLに張り付けてください。
順番に増やしていけばOK。
あわせて読みたい
