首页 > 原创文章 > 软件开发 > 查看文章

Photoshop宽度像素和网页宽度像素不一致的原因和解决办法

所属分类:软件开发 来源: 丁老师原创 更新时间:2025-02-26 11:00 浏览: 5897 IP属地: 深圳

在用photoshop设计时,有的同学会发现,在网页中设置的宽度1000px,截屏后,再用photoshop打开后测量同样图像的宽度时,这个宽度就不是1000像素,而是1200多甚至1300多,是个很奇怪的问题,丁老师检查了photoshop的分辨率(72,无问题),和网页缩放(100%)后,都没发现问题,那么到底是怎么回事呢?

image.png

如图,网页中1000的宽度

image.png

在photoshop中,截图后,测量宽度为1250px


丁老师忽然想起,这种是否因为桌面分辨率缩放引起的呢?一看果不其然,桌面分辨率设置为了125%

a3.jpg

这也就意味着,在浏览器中,开发者工具显示的是网页的css设置宽度,但是被放大了25%倍,所以显示宽度就变大了。

要解决这个问题,其实不难,photoshop的默认分辨率为72,我们根据公式得出:

解:

125%:72=100%:x

    125x=100x72

    125x=7200

    x=7200/100

    x=57.6

即,截图后把photoshop的分辨率设置为57.6即可

image.png

你看,是不是恢复正常了呢?

相关文章

CSS常用字体及网页引用方式

1.字体列表及引用链接鸿蒙字体 - B 站400 字重 CSS://s1.hdslb.com/bfs/static/jinkela/long/font/regular.css 500 字重 CSS://s1.hdslb.com/bfs/...

Javascript复制对象改变原值的解决办...

在进行vue开发中,经常会遇到复制对象,赋值新对象后,原对象值被改变的问题,举个例子:let old={ "a":1, "b":2 } let new=old; new['c']=...

Uniapp picker 多列数据更新后不...

在uniapp中,使用picker multiSelector多列联动选择时,单独更新某列数据后,在前端没有显示,之前的写法:this.data_list[1]=[]; var aaa=[]; aaa.push(1); aaa.push...

扫二维码自动选择支付方式的实现

今天有小伙伴问,请问丁老师可以实现扫二维码,自动选择支付方式吗?比如支付宝扫码就支付宝支付,微信扫码就微信支付,云闪付扫码就用云闪付银联支付。这种方式可以实现吗?答案是肯定的,这种扫码支付方式,不但可以实现,而且已经大范围的应用在了我们...

推荐文章

微信小程序提示“手机号快速验证组件”资源包用...

微信小程序自2023年8月起,开始对《手机号快速验证组件》进行收费,每个小程序有1000次的免费额度,超过额度就要收费。说白了就是以后在使用微信小程序获取用户手机(用户主动授权)的时候,需要按次数收费了。那么,在当前的经济状况下,如何做到轻...

PhpStorm怎么取消html文件中sty...

phpstorm程序中,在打开html时总会出现对 style属性的折叠和隐藏,这样在检查代码的时候非常不直观,容易漏掉很多东西,非常的不方便,如图:

安装fastadmin提示“你所浏览的页面暂...

安装fastadmin,打开后提示"你所浏览的页面暂时无法访问",无法安装,是因为程序的runtime没有写权限,需要对runtime目录,添加写权限。解决方法:windows:右键目录,写入按钮打勾。如果不行,在“安全...

Tortoise Svn出现No Path ...

在日常开发过程中,突然发现svn无法提交和更新,出现“no path or pathfile specified on the command line”的错误,网上搜了一圈百度 google 以及stack overflow都没找到真正能...

当前在线
免费咨询