PerfectPixel、Chrome拡張機能により、ウェブ開発者と開発者は、開発したHTML Webサイトの上部に半透明の画像を簡単にオーバーレイできます。 Webページ上で画像を移動することにより、開発者はピクセルの違いを視覚的に確認できます。拡張機能には不透明度オプションもあり、オーバーレイと開発されたHTMLの両方を表示できます。画像を移動すると、PerfectPixelポップアップで座標が自動的に更新され、Web開発者がコピーして使用できます。
拡張機能をインストールしたら、ツールバーのボタンをクリックすると、ウェブページにポップアップが表示されます。クリック 新しいレイヤーを追加 ローカルシステムからファイルを選択します. この画像は、ウェブページ上のレイヤーとしてすぐに追加されます。あなたはできる 表示/非表示 画像と別のものを選択する. 画像を移動して別の場所でテストします位置、座標はポップアップで自動的に更新されます。好きなだけ画像を追加し、クリックして特定の画像を選択できます。画像が正しく配置されたら、更新された座標を使用して、CSSを介して画像を配置できます。開発者は、複数のオーバーレイのサポートに言及しています。ただし、テストでは複数のレイヤーを追加できませんでした。
パーフェクトピクセル オプション 有効にすることができます ストレージ互換モード、 画像のアップロードに関する互換性の問題を修正するためにあります。ただし、互換モードを使用する場合の制限の1つは、ファイルサイズが最大1.5 MBに制限されることです。有効にすることもできます デバッグモード そして ホットキー。
ただし、テストの結果、できることは複数のレイヤーを追加すると、特定のページで一度に1つのレイヤーのみを表示できます。これは残念な制限であり、開発者は複数のレイヤーを一度に表示できるように変更することを検討する必要があります。 [ロック]ボタンは、追加した画像レイヤーの位置を保存します。拡張機能を終了しても（パネルが消えるようにボタンをもう一度クリックすると）、次に開いたときにそれらの画像の位置が記憶されます。
PerfectPixel拡張機能は、ウェブ開発者やデザイナーにとって非常に便利なツールであり、以下のChromeウェブストアのリンクから入手できます。
Google Chrome向けのPerfectPixelのインストール
コメント