⼿机图⽚到底要做多宽才可以适应所有⼿机屏幕的尺⼨?
现在移动互联⽹正搞得风⽣⽔起,⼤伙也不⽢⽰弱,周围的朋友会经常从⾥⾯发发图⽚,设计师们也经常制作移动⽹站和⼿机APP等,这些过程中⼤家都会碰到这样⼀个问题:⼿机图⽚到底要做多宽才可以适应所有⼿机屏幕的尺⼨?
最终得出的结果是:想⾼清显⽰图⽚做成1080px通吃所有机型,想节约⽤户流量图⽚做成540px通吃所有机型,从⼿机分辨率和常⽤⼿机机型分析如下:
⼀、分辨率:(长*宽)
[4:3]
VGA 640*480 (VideoGraphics Array)
QVGA 320*240(Quarter VGA)
国外婴儿奶粉HVGA 480*320(Half-size VGA)
SVGA 800*600 (SuperVGA)
新浪微博登录不了
[5:3]
WVGA 800*480 (WideVGA)
[16:9]
FWVGA 854*480 (FullWide VGA)
咳嗽吃什么HD 1920*1080 HighDefinition
QHD 960*540
[标清⾼清]
720p 1280*720 标清
1080p 1920*1080 ⾼清
⼆、常⽤机型
[iOS]
iphone 4/4s 960*640
iphone5(s) 1136*640
iphone6 1704×960工作态度评价
[Android]
note2 1280*720
2023年5月1号放假几天三星9220 1280X800
note3 1920x1080
三星galaxy s4 920x1080
⼩⽶1 854*480
⼩⽶2 1280*720 标清
⼩⽶3(s) 1920*1080 ⾼清
三、建议⼿机图⽚制作宽度:
由上⾯的分析可见:
1.苹果最⼤的分辨率宽度是960px,所以图⽚宽度建议制作成960px(480px)、640px(320px)和就可以适应所有苹果⼿机,括号中的宽度代表图⽚做成实际像素的⼆分之⼀⼤⼩也可以正常显⽰。如果图⽚清晰度要求⾼960px通吃,要求不⾼480px通吃。
2.安卓最⼤的分辨率宽度是1080px,所以⼿机图⽚的宽带建议制作成1080px(540px) 800px(400px) 720px(360px)
480px(240px),括号中的宽度代表图⽚做成实际像素的⼆分之⼀⼤⼩也可以正常显⽰。如果图⽚清晰度要求⾼1080px通吃,要求不⾼540px通吃。
结论:如果想通吃全部机型,想⾼清显⽰1080px,想节约⽤户流量540px,⽤CSS让图⽚⾃适应宽度就ok。CSS让其⾃适应宽度写法:width:100%;text-align:center;。
>2022年端午节
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论