Adobe Bracketsの補足

brackets2.png
昨日のBracketsの記事、少々言葉足らずの点があったので補足したいと思います。
BracketsでCSSのセレクタを選択するとライブプレビューの画面にセレクタの範囲が表示されるというくだりについてですが、単に有効な範囲が表示されるだけなら、Google Chromeのデベロッパーツールでもできる訳ですので、そんなに違いがないように思えてしまいますよね。

Bracketsの場合セレクタの範囲だけでなく、セレクタで指定したwidthやmarginなどのプロパティが反映された形でライブプレビューに視覚的に表示されるので、想定した設定とずれていれば修正がしやすくなります。
CSSだけでレイアウトするのは理にかなっていることなのかも知れませんが、HTMLだけで指定する古いやり方が染み着いている自分としては直感的でないCSSでのレイアウトは最初地獄の苦行に近いものがありました。
ちゃんとwidthなどを設定しているつもりでもなぜかずれていたり、padding指定でどうレイアウトが変わるかなど視覚的に見えないと具体的に理解できなかったりしたところがこのライブプレビューの表示で大変助けられました。
なのでもう手放せませんね。

スポンサーリンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です