はてなブログで表を作るのに、今まで普通にHTMLを使って表を作っていました。
雛形を作ると簡単にできるので、これでいいやと思っていたのですが、先日「エクセルからコピペで作れるよ」ってきいて、目からウロコでした。
とりあえずやってみましょう。
まず試しにこのエクセルに入力したデータでやってみます。
850のところは、300+300+250の計算式（SUM）が入力されています。
エクセルをコピペして「編集見たまま」に貼り付ける
▼ 貼り付けた結果がこちら。表になってる…。
| test | |
| ３月 | 300 |
| ４月 | 300 |
| ５月 | 250 |
| 850 |
次に「HTML編集」を確認します。中はこうなっていました。
<table width="152">
<tbody>
<tr>
<td width="82">test</td>
<td width="70"> </td>
</tr>
<tr>
<td>３月</td>
<td>300</td>
</tr>
<tr>
<td>４月</td>
<td>300</td>
</tr>
<tr>
<td>５月</td>
<td>250</td>
</tr>
<tr>
<td> </td>
<td>850</td>
</tr>
</tbody>
</table>
すごいな。ちゃんと表のHTMLになってる。。エクセルに記入されている計算式は無視で、そのまま文字がコピペされているようです。
少し編集して「HTML編集」に貼り付ける
| ３月 | 300 |
| ４月 | 300 |
▲ こちらでやってみましょう。
コピペして「編集見たまま」に貼り付け、「HTML編集」から該当箇所をコピペ。
赤字部分を少し追記しました。
<table width="152" border="3" bgcolor="#ccff99">
<tbody>
<tr>
<td width="82" align="center">３月</td>
<td width="70" align="right">300</td>
</tr>
<tr>
<td align="center">４月</td>
<td align="right">300</td>
</tr>
</tbody>
</table>
これを、再度「HTML編集」に貼り付けた結果がこちら。
| ３月 | 300 |
| ４月 | 300 |
ちゃんと色がついたり、位置が調整されていますね。エクセルから貼り付けることで、表の骨格ができているので、あとはそこに少し手を加えるだけで、簡単に作りたい表を作ることができそうです。
なにこれ、便利すぎる！
連結している表はどうなるのか
エクセルで、連結したものを作ってみました。
先ほど同様、コピペして、「編集見たまま」に貼り付けます。
| test | |
| 3月 | 300 |
| 4月 | 300 |
| 600 | |
えっ (*´Д｀)
できた
かなりびっくり。連結もきちんと反映されました。
HTML編集はこうなっていました。
<table style="border-collapse: collapse; width: 106pt;" border="0" width="140" cellspacing="0" cellpadding="0">
<tbody>
<tr style="height: 18.0pt;">
<td class="xl65" style="height: 18.0pt; width: 106pt;" colspan="2" width="140" height="24">test</td>
</tr>
<tr style="height: 18.0pt;">
<td style="height: 18.0pt;" height="24">3月</td>
<td align="right">300</td>
</tr>
<tr style="height: 18.0pt;">
<td style="height: 18.0pt;" height="24">4月</td>
<td align="right">300</td>
</tr>
<tr style="height: 18.0pt;">
<td class="xl65" style="height: 18.0pt;" colspan="2" height="24">600</td>
</tr>
</tbody>
</table>
高さとかも記載があるからなんか文字数がすごいことになっていますが、表の作りの部分はシンプルで、ちゃんと連結させるHTMLが入力されていました。
複雑な表ほどエクセルで作成してから貼り付けたら時間短縮になるね！
表の作り方の基本はこちらをどうぞ。
表の作り方の基本、色の付け方などをまとめています。今回使ったタグもこちらに記載しています。
最後に
ということで、はてなブログでは、簡単に表を作ることができる話でした。
私、はてなブログの定型文作成に「表」の雛形をいれていたのですが…エクセルからのコピペが便利なので、もういらないですね。笑
