バカネコ日記

バカネコ講座を始める。

本日の講義は、自動改行の補習。
楽天日記に限らず、掲示板やブログでも、よく使われる自動改行であるが、
うっかりすると、原因不明のトラブルに見舞われる。
HTMLを使える場合は、特に注意が必要だ。

このテーマについては、これまでも何度か、解説したが、
今日は別の角度から、原因を観察してみよう。

次の３行からなる文章を見ていただきたい。

　　例文１
　　こんにちは。
　　バカネコ日記です。
　　さようなら。

何もしなくても、ちゃんと３行になっている。
だが、HTMLの規則では、このような書き方をすると、以下のように
１行になってしまう。　すなわち、

　　例文２
　　こんにちは。バカネコ日記です。さようなら。

HTMLでは改行する場合は、<br>タグで、その改行位置を
指定しなければならない。
だから、HTML的に正しく書くと、

　　例文３
　　こんにちは。<br>
　　バカネコ日記です。<br>
　　さようなら。<br>

または、

　　例文４
　　こんにちは。<br>バカネコ日記です。<br>さようなら。<br>

となる。

楽天日記も、れっきとしたホームページであり、HTMLで構成されているから
このルールに従わなくてはならない。
そうしないと、インターネットエクスプローラなどで、まともに表示されない。
全部、金魚のウンコになってしまう。

だが、ただの文章を書くのに、毎回、行末に<br>を付け加えるのは
あまりにも面倒だ。
だから、自動的に行末を検出して、<br>を追加するようにしたのが
自動改行システムなのである。



さて、テーブルレイアウトを使ったテンプレートなどを、
そのまま使うと、間延びしてしまうことは、何度も指摘してきた。
なぜそうなるのか、見てみよう。

自動改行されるページでは、上記の例文１のような文章を入力すると
自動的に、行末に改行タグ<br>が追加される。
つまり、実際にサーバにアップロードされる文章は、例文３なのだ。
勝手に書き換えられるのである。

ここで、以下のようなテーブルの場合を、考えてみる。
　　<table border="1">
　　<tr>
　　<td>
　　こんにちは
　　</td>
　　</tr>
　　</table>
意図した表示

こんにちは

これは、１行１列しかない、単純な枠のようなテーブルである。
だが、自動改行が設定されていると、これをアップした場合、
次のように自動的に書き換えられる。
　　<table border="1"><br>
　　<tr><br>
　　<td><br>
　　こんにちは<br>
　　</td><br>
　　</tr><br>
　　</table><br>

各行に改行タグ<br>が追加されたため、中身の「こんにちは」に
たどり着くまでに３回、テーブルが終了するまでに４回、改行されてしまう。
そのため、以下のように、極端に間延びしてしまう。
自動改行での表示↓

こんにちは

これが、自動改行による「テーブル間延び現象」の原因なのだ。
HTMLは、どこも間違ってないのに．．．と
面食らった方も、多いのではあるまいか。



これを防ぐためには、以下のように、１行に繋げて書けば良い。
<table border="1"><tr><td>こんにちは</td></tr></table>

これなら自動改行されても、以下のように、改行タグは１個しか付かない。
<table border="1"><tr><td>こんにちは</td></tr></table><br>

その改行さえも、いやだと言うなら、最後の</table>タグの後ろに続けて
次の文章を書けばいい。



テーブルの間延びだけなら、以上のように解決できる。
だが、HTMLを使っていると、自動改行は他にも問題を起こすことがある。
次回は、自動改行でおかしくなった、めずらしい例を紹介しよう。


【本日のポイント】
１．自動改行では、文の行末に改行タグが、無条件で付加される。
２．テーブルなどが間延びするのは、各タグの末尾に、改行タグが
　　自動で追加されるため。
３．テーブルの間延びを防ぐには、１行につなげて書き、
　　改行タグを自動付加させないようにする。


【参考ページ】
　自動改行とは何か
　改行コードの解説


【次回の講義予告】
　どこも間違ってないのに、なぜ？

【トド短信】
　近所をうろついていた猫を見つけた。
　草をむしり、猫じゃらしにして、誘ったのだが、逃げられた。



【ダウンロードページ】
・楽天日記専用バックアップツール、バーニャン３号のサンプル版、
　「バーニャン・ミニ」のダウンロードはこちら。
・にゃんタグのサンプル版は、このページの中段付近。
・バカネコ・ビューアのダウンロードはここ。

１日１票！　ブログランキング→


※バカネコ講座では、安全な方法を選んで紹介していますが、
　途中でわけがわからなくなっても、責任は負えませんので、あらかじめご了承下さい。


ネコでもわかるＰＣ講座はこちら　→　バカネコ講座

悲惨なキャンセル事情　バカネコ講座　バカネコソフト　バカネコ村　爆笑ガイド　猫砂の研究　パソコン購入費用の削り方　現物の投下位置　ずぼらなアクセスアップ　ページを読みやすくする方法　バーニャン・ミニ　楽天日記のバックアップ　にゃんこのコスプレ　テキストリンク下線の消し方　楽しめるアフィリ　己を知れ　自分のＰＣを知る　バカネコ・ビューア　バーニャン３号　にゃんタグ・フルバージョン　【楽天トラベル】


画面右上「日記リンク追加」をクリック、「◎追加する」ボタンを押すとこの日記がリンクできます。
このサイトの新着記事の通知をご希望の方はご利用ください。