【Tools】Chromeデベロッパーツールを使いこなすための５つのTips

つい数記事前にCSS DigというCSSデバッグツールをご紹介したのですが、やはりChromeのデベロッパーツールは充実していますね。本日は基本的な使い方ではなく、もっと便利に使うためのTipsをご紹介します。

（CSS Digに関するページはこちら）

※ キーはMacとなっています。Windowsユーザーの方CommandをCtrlに読み替えてください。

commandを押しながらカーソルを複数箇所におけます！
（ちなみにcommand+Dで同じ文字列を選択していくこともできる！）

このようなJSでも。

ぽちっと押すと。

見やすく！

まとめ

いかがでしょうか？
デベロッパーツールを使いこなすことは最も必要なスキルの一つだと思っているので、是非こういった便利な機能は把握しておきたいですね！

そのほかにもスマフォの傾きをシミュレートさせたり、カラーピッカーもついていたりと、とても充実したツールが揃っているので是非マスターしてみてください！

Tsukasa Nagata

株式会社ユニマル代表取締役COO。「Web制作チームのためのクリエイティブ・プラットフォーム『universions』」では、UIデザイン・開発とマーケティング、色んなところに遊びにいくのが担当。