Webページ上の要素の幅を測ることが
できる便利なChrome拡張機能。
カーソルを測りたい場所に移動するだけで
要素間のサイズを測ることができます。
![Webサイトの間隔、サイズを測ることができるWeb制作に便利なChrome拡張機能 『Dimensions』](https://pc.mogeringo.com/wp-content/uploads/2024/05/dimensions-thumb.jpg)
目次
リンク先
インストール
![Webサイトの間隔、サイズを測ることができるWeb制作に便利なChrome拡張機能 『Dimensions』](https://pc.mogeringo.com/wp-content/uploads/2024/05/dimensions1.png)
上記リンク先ページをChromeで開き、「Chromeに追加」をクリックします。
![Webサイトの間隔、サイズを測ることができるWeb制作に便利なChrome拡張機能 『Dimensions』](https://pc.mogeringo.com/wp-content/uploads/2024/05/dimensions2.png)
拡張機能を追加をクリックするとインストールが完了します。
Chromeにアイコンが追加されます。
頻繁に使う人はアイコンをピン留めして表示しておくと、使いやすく便利です。
使い方
![Webサイトの間隔、サイズを測ることができるWeb制作に便利なChrome拡張機能 『Dimensions』](https://pc.mogeringo.com/wp-content/uploads/2024/05/dimensions3.png)
追加されたアイコンをクリックして、Webページ上で測りたい場所にカーソルを移動させます。
十字になってカーソルが表示され、要素間の幅がピクセルで表示されます。
主にWeb制作時に便利で、ここをちょっと開けてほしいなど様々な要望に対応できます。
![Webサイトの間隔、サイズを測ることができるWeb制作に便利なChrome拡張機能 『Dimensions』](https://pc.mogeringo.com/wp-content/uploads/2024/05/dimensions4.png)
よくあるのがヘッダーの幅など変更の対応などで活躍できそうです。
ちょっと広げて!など曖昧な指示ではなく、何ピクセルですか?みたいに
具体的な数値で調整可能です。
![Webサイトの間隔、サイズを測ることができるWeb制作に便利なChrome拡張機能 『Dimensions』](https://pc.mogeringo.com/wp-content/uploads/2024/05/dimensions5.png)
カルーセルの間の幅などもしっかりと計測が可能です。
Web制作時にとても便利なChrome拡張機能です。
コメント