<wbr>タグの使用例


普通に改行を禁止した場合は、 <nobr>~</nobr>の使用例 で示した。それと同じ文章に<wbr>タグを挿入した場合にどのようになるかを試す。

改行に関する指定をしなかった場合

改行に関する指定をしなかった場合、ブラウザや画面解像度、ブラウザのウィンドウサイズにより任意の位置で改行が行われます。 ブラウザのウィンドウサイズを広げたり縮めたりすると分かりやすいと思います。 この場合、表示状態によって、例えば「マイクロソフト社」という単語が「マイクロソ」「フト社」というように、 途中で途切れ読みづらい文章になってしまうかもしれません。

表示例
Windows95は、パーソナルコンピュータを使いやすくするための、オペレーティングシステムである。 開発元のマイクロソフト社は、Windows3.1から得た知識、経験、ユーザーからの要望などに基づき、 あらゆるレベルのユーザ....


改行禁止タグと改行禁止中の改行許可タグを使用した場合

上の例のような単語の途中で自動改行されることを回避するために、<nobr>~<nobr>を使うと、 今度は、横長な文章になりすぎて読みづらくなってしまう()。 そこで、<nobr>~</nobr>タグで囲んだ文章内で、 改行されてもかまわない位置に<wbr>タグを置く。

記述例
<nobr>Windows95は、<wbr>パーソナルコンピュータを<wbr>使いやすくするための、<wbr>オペレーティングシステム<wbr>である。<wbr>開発元の<wbr>マイクロソフト社は、<wbr>Windows3.1から<wbr>得た<wbr>知識、<wbr>経験、<wbr>ユーザーからの要望などに<wbr>基づき、<wbr>あらゆる<wbr>レベルの<wbr>ユーザ....</nobr>
表示例
Windows95は、パーソナルコンピュータを使いやすくするための、 オペレーティングシステムである。開発元のマイクロソフト社は、 Windows3.1から得た知識、経験、ユーザーからの要望などに基づき、 あらゆるレベルのユーザ....

これからわかるように(もちろん偶然にも(2)の例で上手く表示されていた場合は、 わからないかも知れないが)単語や文節の途中で改行されることなく、読みやすい文章になっている。


Copyright (C) 1998 Arbel's BOX