CSS Inspector は、マウスを合わせるだけで任意の要素の完全な CSS プロパティを表示できる強力な開発者ツールです。クリックしてスタイルをロックし、直接編集して、変更が即座にページに反映されるのを確認できます。
レイアウトの問題を修正する場合でも、お気に入りのウェブサイトを研究する場合でも、CSS Inspector は必要なすべてをクリーンなフローティングパネルで提供します。ブラウザの DevTools を開かずに簡単に検査できます。
要素にマウスを合わせると、フォント、サイズ、色、間隔などを即座に確認できます。
要素をクリックしてパネルを固定し、詳細な検査を行えます。
値をダブルクリックして直接変更します。編集内容は即座にページに反映されます。
個々のプロパティまたはスタイルブロック全体をワンクリックでクリップボードにコピーできます。
マージン、ボーダー、パディングの値を視覚的に確認できます。
ページ上の要素の幅、高さ、位置を表示します。
CSS Inspector は 40 以上のプロパティを表示します：
font-familyfont-sizefont-weightline-heightletter-spacingtext-aligntext-transformcolorwidthheightpaddingmarginborderborder-radiusbox-sizingdisplaypositiontoprightbottomleftz-indexfloatoverflowbackground-colorbackground-imagebackground-sizebackground-positionopacitybox-shadowtext-shadowtransformtransitioncursor位置がずれている要素をピンポイントで検査します。
お気に入りのウェブサイトのスタイルを研究します。
コードを書く前に変更をテストします。
ミーティング中にライブで変更を提示します。
新しい要素の CSS コードを簡単に取得できます。
DevSuite Pro ツールバーから CSS Inspector アイコンをクリックします。
任意の要素にカーソルを合わせてプロパティを確認します。
要素をクリックしてパネルをピン留めします。
値をダブルクリックして調整します。
更新されたコードをコピーしてプロジェクトで使用します。
DevSuite Pro を無料でインストールして、ブラウザで 39 以上の開発者ツールを利用しましょう。