以前Firefox有个插件，可以把设计稿载入进去，设置成半透明，然后这样布局有所参照，可以尽可能完美的还原页面，甚至精确到像素。但 是随着FF的不断升级，那个插件很久没有更新，已经不能用了。 当然我们也有其他方法实现，此神功威力强大，但是内力消耗也甚大，慎用，慎用。
对眼神功上篇
html:after,
body {
display: block;
position: absolute;
top: 0;
left: 0;
padding: 0;
margin: 0;
width: 100%;
height: 5000px;
}
html:after {
content:"";
opacity: 0.15;
z-index: 1;
background: url(page.png) no-repeat center top;
}
body { z-index: 2; }
说明：布局时可将以上css加入，完成后删除即可。使用：after伪类设置背景图，讲设计稿半透明化固定在最底层，不影响html和body。
对眼神功下篇
此下篇配合上篇，可以完美发挥对眼神功威力，可以以最快的速度，精准还原设计稿，甚至于精确到像素，如果你愿意的话，当然时间和精力毕竟消耗还是有点大的。
说明：webstrom是个很好的前端开发工具，下篇主要借用其css-x-fire插件，此插件允许在firebug中动态调整css，调整完成后，一键改写css文件，方便快捷。
有强迫症，总想精确到像素还原的童鞋可以试试完整篇的对眼神功。