多くの場合、一部の顧客は、レイアウト用にサイトのレイアウトを提供し、すべてのブラウザーのマークアップでピクセル単位の正確な精度を必要とします。
この対応を確認するのは簡単です-サイトのスクリーンショットを撮って、たとえばPhotoshopでグラフィックレイアウトと組み合わせる必要があります。
ただし、レイアウトプロセスでのみ、このような手法を使用するのはあまり便利ではありません。
Firefoxのソリューション
最近、Firefoxの
Pixel Perfectという
アドオンに出会いました。
レイアウトの上に半透明のレイアウトが表示されるため、すべての不正確さがすぐに表示されます。
また、Pixel Perfectは誰にとっても素晴らしいものであり、Firefoxのみを対象としています。レイアウトはさまざまなブラウザーで動作するはずです。
皆のためのソリューション
<script>介してhtmlマークアップを使用してファイルに接続できる小さなスクリプトを作成しました。
また、対応する拡張機能（または組み込みの
0機能）があるすべてのブラウザーで、
ユーザースクリプト （
グリースモンキースクリプト ）として使用することもできます。
レイアウトをスクリプトにフィードするには、レイアウトをpng、jpg、またはgif形式で、レイアウトをlayout.png（jpgまたはgif）に変更した後、htmlファイルがあるディレクトリにドロップするだけです。
ホットキー：
- Shift +スペース -レイアウトレイヤーの表示/非表示
- ctrl + Enter-レイアウトサイズに合わせてブラウザーウィンドウのサイズを変更します（FF、IE6、およびSafariで動作します）
必要に応じてレイアウトを配置するには（たとえば、中央に列の形で固定レイアウトを作成する場合）、すべてのアクションがある同じディレクトリに
pmarkup.cssファイルを作成できます。
/* : */
#pmOverlay { /* div, image */
text-align: center;
}
#pmOverlayImg {
/* image */
}
アクションで見る
IE6-7、Firefox 2-3でテスト済み。 Opera 9.5、Safari 3