子育てエンジニアブログ

子育てに励むシステムエンジニア(SE)のブログ

ChromeのデベロッパーツールでCSSの記述行に移動(ジャンプ)する方法

ChromeデベロッパーツールでCSSの記述場所に移動(ジャンプ)する方法についてです。


まずは、Chromeデベロッパーツールを開きます。
(command+option+I)

次にStylesパネルを開きます。
f:id:STSA:20181201233221p:plain

セレクタやプロパティや値の上で「command+クリック」します。
(Windowsでは「ctrl+クリック」です。)
f:id:STSA:20181201233505p:plain

すると、記述されている行までジャンプしてくれます。
f:id:STSA:20181201233519p:plain

覚えておくと便利な小技ですね。