日々の記録

ほどよく書いてきます。

ブログに表を乗せるときのメモ

2019年06月01日 23時55分55秒 | その他雑記

ブログに表を乗せるとき、tableの罫線を書くのに困っていた。

<table style="border-collapse:collapse">
<tbody>
<tr>
<td style="border:solid 1px black; text-align:center;">要素1</td>
<td style="border:solid 1px black; text-align:center;">要素2</td>
<td style="border:solid 1px black; text-align:center;">要素3</td>
</tr>
</tbody>
</table>

  ロックウェル
スーパーフィシャル硬さ
(予荷重3kgf)
ロックウェル硬さ
(予荷重10kgf)
測定荷重 15kgf 30kgf 45kgf 60kgf 100kgf 150kgf
1/16"硬球 15T 30T 45T F B G
1/8"硬球 (15W) (30W) (45W) H E K
1/4"硬球 (15X) (30X) (45X) L M (P)
1/2"硬球 (15Y) (30Y) (45Y) R (S) (V)
Diamond 15N 30N 45N A D C

というように今まで書いていたのだが(ページのcssをいじれないので、インラインcssで頑張るよりほかになかった)、文字数が膨大になってしまい、gooブログの文字数制限30,000文字位内に入らないことがあった。上記で3108文字です。

罫線の引き方他になかったかなと思っていたらあった。

<table style="border-collapse:collapse;" border="1">
<tbody>
<tr>
<td align="center">要素1</td>
<td align="center">要素2</td>
<td align="center">要素2</td>
</tr>
</tbody>
</table>

 とやると文字数が減る。境界の太い細いが少しだけ違うけど、許容値でしょう。
  ロックウェル
スーパーフィシャル硬さ
(予荷重3kgf)
ロックウェル硬さ
(予荷重10kgf)
測定荷重 15kgf 30kgf 45kgf 60kgf 100kgf 150kgf
1/16"硬球 15T 30T 45T F B G
1/8"硬球 (15W) (30W) (45W) H E K
1/4"硬球 (15X) (30X) (45X) L M (P)
1/2"硬球 (15Y) (30Y) (45Y) R (S) (V)
Diamond 15N 30N 45N A D C


こちらは1720文字。一つのtd要素で57文字使っていたのが25文字で済むようになる。913要素ある表を載せたが29,216文字節約できていたことになる。

追記:少々問題があって、スマホのブラウザから見ると罫線が表示されないorz

多分border="1"の部分が現行のHTMLでサポートされてないのでしょう。

コメント    この記事についてブログを書く
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする
« gooブログの文字数カウンター... | トップ | 硬さ換算(JavaScript) »

コメントを投稿

ブログ作成者から承認されるまでコメントは反映されません。

その他雑記」カテゴリの最新記事