在不同的网站上搜索，但没有明确的答案。每次我在Photoshop中设计新的设计时，我都会尝试将像素大小与我的CSS代码匹配。然后浏览器呈现出来的大小与我在Photoshop文件中看到的完全不同。我总是以72pp分辨率获取所有文件。
有什么技巧可以让Photoshop的像素大小在呈现后与CSS像素大小相同吗？
以下是一个视觉示例...
相同的排版，这里使用的是Google字体排版。
两者都具有18px的值
Photoshop：
CSS渲染：
匹配Photoshop像素尺寸和CSS渲染像素尺寸的技巧
4
- Daniel Ramirez-Escudero
4
如果它们是同一个元素，为什么它们有不同的文本？ - Paulie_D
1这不是答案，而是有用的 Chrome 插件 - https://chrome.google.com/webstore/detail/perfectpixel-by-welldonec/dkaagdgjmgdmbnecmcefdhjekcoceebi?hl=en 可以帮助您将 HTML 与 PSD 匹配。就我所知，您的HTML应该几乎与设计完全相同，那么为什么需要额外的努力来匹配像素？ - Pravin W
@PravinVaichal 我有时候太过于完美主义，也许有什么诀窍可以让精确值保持一致。但我开始觉得这是不存在的。 - Daniel Ramirez-Escudero
@DanielRamirez-Escudero 听起来很不错，如果你得到任何有用的答案或方法，请也为其他人发布 :) 祝你好运 - Pravin W
1个回答
1
我不知道，伙计。我将所有的psd完美地转换成css，没有任何问题。
始终使用72dpi的图像，并确保在首选项 > 单位和标尺 > 单位中将“标尺”和“类型”都标记为像素。
始终使用72dpi的图像，并确保在首选项 > 单位和标尺 > 单位中将“标尺”和“类型”都标记为像素。
- Alvaro Menéndez
3
Menendez，你的PSD文件中的像素值和CSS文件中的像素值匹配吗？它们看起来没有稍微大一点吗？ - Daniel Ramirez-Escudero
图片总是相同的。对于字体，我恐怕无法帮助你，因为我从不使用像素作为尺寸单位。我总是使用em，并且在视觉上尽量接近字体大小，并使用一些Chrome的好用应用程序，比如"页面标尺"。 - Alvaro Menéndez
顺便说一下，当你创建一个新的psd文档时，你总是可以使用“网页”预设。这可能会有所帮助。 - Alvaro Menéndez
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接