<< Yahoo!翻訳検索 ブログツール:HTMLやCSS... >>
 

スキン編集 デバッグ講座:全角空白

はじめに

 ちょっとしたことなんだけど、知らないと悩んじゃうことってありますよね。一晩経ってから見てみると、なんでこんな単純なことに悩んでたんだろうって思ったり。そんなのは、私だけでしょうか。
そんな方に向けた、初心者向けのデバッグ講座です。




全角空白が入っていませんか

 CSSの区切りは半角スペースまたはタブになっています。ブラウザ上でCSS編集を行っている方は、タブは次の項目へ飛んでしまうので、スペースを入れて整形されているのではないでしょうか。

ここで、注意したいことがあります。
それは、全角スペースです。コメントを入力した後など、漢字モードになっていて、何気なくスペースを入れると全角スペースになります。
全角スペースが入っていると、思ったように機能しないのですが、気がつかないのです。

全角スペースはブラウザ上のテキストエリアからは気づき難いために多くの方が悩んだり、また同じ経験をされたベテランさんもいらっしゃるのではないでしょか。

チェック方法

ブラウザ上のテキストエリアからは全角、半角スペースの判断は難しいと思います。私は、テキストエディタを用いてチェックしています。
CSS編集の内容を、テキストエディタにコピーして見ると、全角スペースが図1に示すように四角い枠で表示されます。
a0031863_15152524.gif


図1 サクラエディタを用いて表示した場合


 今回は、サクラエディタの例を表示しましたが、お使いのエディタに全角文字列を強調して表示したり、色をつけたりと機能があると思いますので調べてみるといいかも知れません。


テキストエディタ

まだ、テキストエディタをお持ちで無い方は、フリーのエディタからはじめてはいかがでしょうか。
フリーでもかなり使えると思います。その他にも、強力なエディタが存在します。気になる方はいろいろと調べてみると良いかもしれませんね。

サクラエディタ


最後に

今回、全角空白についてスポットを当てましたが、全角文字列を利用すると機能しません。全角文字列をテキストエディタで一括で半角文字列に変換する荒業もあります。なにかのときに使えるかもしれませんので、覚えておくのもいいかもしれませんね。では、またの機会に・・・

[PR]
記事の下の方に広告が表示される場合があります。この広告はエキサイトの広告枠です。
by potto37 | 2005-10-15 15:16 | │├デバッグ
<< Yahoo!翻訳検索 ブログツール:HTMLやCSS... >>
掲載の記事や画像などすべての複写・転載・公衆送信等はご遠慮ください。