怎样将页面做成和设计师的psd文件一致，或者高度相似

Question

将psd做成页面的时候，字体有出入，间距也不一致，有什么好的办法解决吗？或者好的工具.

Answer 1

这个和经验有关 写多了自然就好了 新手的话 第一自己的html和css要扎实 不然其他都免谈 其次写代码之前一定对着图规划一下 头脑中要有一个布局的规划图 然后在一步一步的调细节 字体和间距 一定要设计师给出ui设计标准 你就照着他的标准写 不一样就不是你的事了

Answer 2

这个锅设计师出来背一下，应该在设计稿上把尺寸都标注好，这样做起来肯定相差无几了，不然就得你自己手动去调整

Answer 3

间距是可以通过css来控制，字体有出入的话，如果找不到统一的页面字体，且文字不是动态的，可以考虑用图片；如果动态的就链接统一的字体库文件吧，要高度相似，这个需要慢慢调，尤其是想要实现浏览器兼容性问题。至于还有什么好的办法或神器，我也想知道！

Answer 4

设计师没有标注的话，原始点就手动在ps里量一下，不想费事就找个类似PxCook这种软件自动标注。

Answer 5

推荐一个chrome插件PerfectPixel ,
你可以把设计稿以半透明状态放到页面上
这样设计稿就能和你写出来的网站重叠在一起,
可以辅助你达到完美还原设计稿.

Answer 6

字体有出入不怪你，设计图的字体都有小数点，页面下效果不能这样，我一般向上取整，
至于间距不对，那就是你自己的问题了。设计稿中间距是可以通过拉参考先确定一个精确的像素值，如果这方面做的不好要加强基础知识了。

Answer 7

字体方面，PS和网页上是有差距的，哪怕是同一种字体，PS和网页上显示的可能都不一样。
其他方面，我觉得就是用心的问题，一般就是布局和css调试，而css调试时比较考验耐心的。