画面ピクセル定規
web page内に0〜200を10刻みで示すCSSベース横rulerを表示します。
使い方
- on-page目盛をCSSサイズ要素との視覚比較に使います。
主な機能と処理範囲
21 tickを作り各labelをindex×10としてCSS layoutします。
処理の仕組み
0,10,...200の21 tickを同構造でrenderします。
例
0〜100区間をUI要素と並べて概算比較できます。
こんな場面で便利
- browser UIのCSS距離/spacing比較に
利用前の確認
- 物理mm/cm rulerではなくzoom・DPR・layoutで物理長が変わります。
よくある質問
200=200物理pixel？
いいえ。校正された物理measurementではありません。