【はてなブログ】はてな記法で自動改行を無効にする方法
スポンサード リンク
私はこのブログを始めた当初からはてな記法で記事を書いてます。
HTMLタグの代わりに記号で見出しや引用等を設置できるのでかなり便利です。
ただ、便利なものが逆に不便になってしまうパターンもあります。
その一つが自動改行。
HTML表記の場合は改行したいときはbrタグを書かなくてはならないのですが、はてな記法の場合Enterキーを押すだけで勝手に改行してくれます。
文章を書くときはpタグやbrタグを書かなくて済むはてな記法はかなり便利なんですが、問題はテーブル等を使う時。
普通に書いていくとおかしなことになってしまいます。
自動改行を無効にする
例1
<table class="kaigyoutest">
<tr>
<td>
aaaaa
</td>
<td>
bbbbb
</td>
<td>
ccccc
</td>
</tr>
<tr>
<td>
ddddd
</td>
<td>
eeeee
</td>
<td>
fffff
</td>
</tr>
<tr>
<td>
ggggg
</td>
<td>
hhhhh
</td>
<td>
iiiii
</td>
</tr>
</table>
<style>
table.kaigyoutest{
width:300px;
border:1px solid #000000;
}
table.kaigyoutest td{
border:1px solid #000000;
width:100px;
</style>
↑この様な3行3列のテーブルを作るとします。
例1の結果
aaaaa |
bbbbb |
ccccc |
ddddd |
eeeee |
fffff |
ggggg |
hhhhh |
iiiii |
↑結果はこんな感じです。
以前はこれよりもひどい結果になっていたんですが、はてな運営が少々改善してくれたみたいです。
といっても、上の結果だと、英数字の上が一行分空いてしまっています。
これは<table>タグ内に勝手に自動改行が入ってしまった事が原因です。
こんな時はtableタグを「>」と「<」で括ると自動改行を無効化することが出来るんです。
例1を改善する
><table class="kaigyoutest">
<tr>
<td>
aaaaa
</td>
<td>
bbbbb
</td>
<td>
ccccc
</td>
</tr>
<tr>
<td>
ddddd
</td>
<td>
eeeee
</td>
<td>
fffff
</td>
</tr>
<tr>
<td>
ggggg
</td>
<td>
hhhhh
</td>
<td>
iiiii
</td>
</tr>
</table><
上のようにtableタグの始めに「>」、終わりに「<」を書きます。
改善した結果
| aaaaa | bbbbb | ccccc |
| ddddd | eeeee | fffff |
| ggggg | hhhhh | iiiii |
↑自動改行が無効化されます。
自動改行させたくない範囲を「>」と「<」で括るだけなので簡単ですね。
注意点
ただ、一つ注意しなくてはならないのは、自動改行無効は「>」の直後と「<」の直前にHTMLタグがないとうまく動作してくれないということ。
例2
> 自動改行
させないようにする<
上の様に文章だけを書くと以下の様な結果になります。
例2の結果
> 自動改行
させないようにする<
自動改行が入ってしまっています。
これは「>」直後と「<」直前にHTMLタグが無いから。
例2を改善
><div>
自動改行
させないようにする
</div><
↑例2をこのように<div>タグで囲んでみます。
改善結果
自動改行
させないようにする
自動改行を無効にすることが出来ました。
まとめ
はてな運営が自動改行による不具合を改善していってくれているので、以前ほどひどい不具合は出なくなってきています。
今回例に出した表（例1）だと、文字の上に1行隙間が出来るだけなのでそこまで気にならないのかなとも思います。
「このちょっとの隙間が気になる」という方は試してみてはいかがですか？？
