ちまたではインデントはタブか?スペースか?といった難しい話(インデント　スペース　タブ – Google 検索)があるみたいですけど、うちはそういったこだわりは全くなくTABを使っていました、現在はスペースを使うようにしてます(大したことない理由なので後述)。

で、Dreamweaverで使うインデントをスペースに変更したのに何か違和感があった。
いくらソースフォーマットしてもTABでインデントされる事があるのた。あるぇ?
全部TABなのかな?と非表示文字を表示してみたところ下の画像の様になった。

HTMLとCSSそれぞれのインデント記号が違う。

HTML側の記号がスペースで、CSS側の記号がTABだった、なにこれ。

原因と解決法

環境設定をよくみてみると[高度なフォーマット:CSS]というボタンがあった。

CSS側のインデント設定もスペースに変更したらおkだったああああ、よかったあああ

まとめ

[コマンド] – [ソースフォーマットの適用] で html(やcss)をインデントしたり出来る。
htmlとcssのフォーマット設定は分かれている。
htmlのインデント設定は[編集] – [環境設定] – [コードフォーマット]から
cssのインデント設定は[編集] – [環境設定] – [コードフォーマット]窓 – [高度なフォーマット:CSS]ボタンから変更する。

たかだかこれだけの事を説明するのに無駄に画像を使ってなにしてるんだろう。

TABを使っていた理由

• Dreamweaverのインデント初期設定がTABだった
• 他人のhtmlを修正する時はほぼすべてTABだった
• スペースだったとしてもソースフォーマットするとTABになってしまう
• インデント幅を後から簡単に変更出来る

で特に疑問を持たずTABでインデントしていた。

スペースに変えた理由

ある日の事、Dreamweaverで書いたソースをWordPressにコピペしてSyntaxHighlighterで吐き出させたページをAnother HTML-lint gatewayでチェックしたらTABを特殊文字で吐き出していてエラーになっていたから、スペースに変換するのなら最初からスペースでインデントした方が楽だという理由。

Share on Tumblr

Tweet