首頁(yè) 猿問手機(jī)頁(yè)面上的圖片尺寸要如何確定？

手機(jī)頁(yè)面上的圖片尺寸要如何確定？

JavaScript

藍(lán)山帝景 2019-04-08 11:18:30

舉個(gè)例子：手機(jī)分辨率是640960，但頁(yè)面渲染下來的實(shí)際像素是320480。但是頁(yè)面設(shè)計(jì)稿是基于640*960做的，這樣頁(yè)面的一張切圖就會(huì)是400實(shí)際像素寬，放在頁(yè)面上大于了手機(jī)能否渲染出來的頁(yè)面。那么，這種頁(yè)面在切圖的時(shí)候，是否說是應(yīng)該將設(shè)計(jì)稿的尺寸/2？還是說應(yīng)該把圖片按比例強(qiáng)制為頁(yè)面實(shí)際像素寬度？貌似這兩種情況都不太適合啊

查看完整描述

2 回答

瀟瀟雨雨

TA貢獻(xiàn)1833條經(jīng)驗(yàn) 獲得超4個(gè)贊

背景圖直接用設(shè)計(jì)稿的高清圖，然后用background-size縮為一半，這樣高清屏上看起來就不會(huì)模糊了；當(dāng)然，相應(yīng)地，非高清屏也是同時(shí)下載了大圖。如果想要非高清屏不浪費(fèi)流量下載大圖的話，保存一份小尺寸的圖，默認(rèn)背景設(shè)為這個(gè)，然后用@mediaonlyscreenand(-webkit-min-device-pixel-ratio:2)給高清屏指定大圖。如果是文章中的圖片的話，約定下用多寬就可以了，比如320或者400這樣

反對(duì) 回復(fù) 2019-04-08