您的位置首页百科知识

to淘宝详情页上传尺寸相同的图,后面几张图总是会拉伸变形,是什么原因导致图片变形?

to淘宝详情页上传尺寸相同的图,后面几张图总是会拉伸变形,是什么原因导致图片变形?

的有关信息介绍如下:

to淘宝详情页上传尺寸相同的图,后面几张图总是会拉伸变形,是什么原因导致图片变形?

最近也是做淘宝,上传图片也遇到了详情的图片被拉伸的问题,百度的答案基本没有有效的,自己研究了一下, 我详情图片全部都是1200*1200的分辨率, 查了下淘宝电脑端详情展示最佳是750px, 如果又全部都改一次分辨率太麻烦了

查看了一下CSS,会默认有一个样式属性:max width="750px", (大概意思就是图片允许最大宽度)

所以会导致图片大于宽大于750px的会被限制到750px显示, 但是没有高度却并没有限制, 所以图片分辨率越大, 会感觉被拉长的越严重. 比如我的是1200*1200的图片, 在第三张后就拉伸到宽750px长1200px显示了, 图片看起来就是被"拉长了", 当然解决的办法就是加个高宽属性就行了, 也就是width="750px" height="750px" (意思就是无论图片多大, 都以750*750显示), 手动加在源码里面未免是太麻烦的, 不可取的. 其实淘宝编辑器默认就是可以改的, 在编辑器里面双击图片即可, 如下图

确保约束锁是锁上的, 然后把宽度改为750(高度会受约束锁自动同比例变化), 改了之后再看css里面就有了高宽约束的属性了, 注意第三张后面的图都要改, 对于图片本身宽度就小于750px的改不改都无所谓了

然后, 详情第三张或者第四张以后的750*750以上大尺寸图片就会显示正常啦