前言：像素是一個很基礎的知識兽叮，生活中我們看的電視、用的電腦猾愿、玩的手機處處都是像素鹦聪，尤其從事前端相關開發(fā)人員，經(jīng)常要和像素打交道蒂秘，但是如果有人問你什么是像素泽本，你知道嗎？
一姻僧、你將學到
- 什么是像素
- 邏輯分辨率和物理分辨率
- 蘋果顯示屏畫面為什么比普通顯示屏看著更舒服
- 常見的240p观挎、360p、720p段化、1080p什么意思
- 移動設備分辨率問題
二嘁捷、什么是像素
維基百科中的定義：像素，為視頻顯示的基本單位显熏，譯自英文“pixel”雄嚣，pix是英語單詞picture的常用簡寫，加上英語單詞“元素”element喘蟆，就得到pixel缓升，故“像素”表示“畫像元素”之意。它不是一個確定的物理量蕴轨，也不是一個具體的點或者小方塊（盡管可以用點和小方塊來呈現(xiàn)）港谊，而是一個抽象概念。
對于一個像素可以認為是由顯示器的一個個“點”來顯示的橙弱，比如我們電腦屏幕就是由很多很多的像素點構成歧寺。因此衡量電腦屏幕分辨率有一個很重要的物理參數(shù)DPI（dots per inch燥狰，每英寸點數(shù)），顯然單位面積中像素的點數(shù)越多斜筐，DPI的值也就越大龙致，屏幕展現(xiàn)的細節(jié)就越多，畫質(zhì)相對也就越清晰顷链。
那為啥我看到的分辨率都是用PPI表示的目代？
在計算機領域，分辨率一般用PPI（pixels per inch）嗤练，表示每英寸最多可以 呈現(xiàn)的像素個數(shù)榛了，但是PPI是可以縮寫為DPI的，兩者表示都沒問題 煞抬。相反在印刷領域忽冻，會經(jīng)常看到DPI這個參數(shù)此疹，比較早的噴墨式印刷機噴的都是一個個點僧诚。
怎樣求設備的PPI？
- 我用的筆記本是ThinkPad E550蝗碎，15.6寸湖笨，屏幕分辨是1920 x 1080（電腦、手機中的寸是指屏幕斜對角線長度蹦骑。順便查了一些ThinkPad和惠普兩種高價筆記本慈省，分辨率相同，沒發(fā)現(xiàn)更高的分辨率眠菇，不考慮外接設備）
- MacBook pro边败，13.3寸，屏幕分辨率是 2560 x 1600（查了蘋果的筆記本捎废，大部分都是1440*900和2560*1600笑窜，當然還有更高的分辨率）
以我電腦為例，用勾股定理求出斜邊2203px登疗，然后除以設備斜對角線15.6排截，最后得出 PPI=141，表示在我電腦上一英寸的直線上可以呈現(xiàn)141個像素點辐益，一英寸的矩形區(qū)域断傲，可以呈現(xiàn)141*141=19881個像素點。
同理可以計算出蘋果電腦（1440x 900） PPI=127 智政，（2560 x 1600） PPI=227
（補充：屏幕的PPI用的是物理分辨率不是邏輯分辨率认罩，所以需要我們先查出屏幕的物理分辨率，那什么是物理分辨率续捂？什么是邏輯分辨率垦垂？）
邏輯分辨率和物理分辨率（重要宦搬，難點）
先明確一個很重要的概念，分辨率有兩種乔外，邏輯分辨率和物理分辨率４踩Ｒ徽帧杨幼！
邏輯分辨率：電腦中系統(tǒng)可以調(diào)節(jié)的分辨率，這和電腦系統(tǒng)有關聂渊，系統(tǒng)可以控制的分辨率稱之為邏輯分辨率差购。
物理分辨率：屏幕出廠就決定了物理分辨率，不管怎么調(diào)節(jié)你電腦屏幕最原始的分辨率是永遠不會變的（除非換顯示屏）汉嗽，這是硬件技術欲逃，屏幕最原始的分辨率稱之為物理分辨率。
（補充：我們平時所說屏幕分辨率饼暑，其實是指系統(tǒng)設置的邏輯分辨率稳析。當邏輯分辨率和物理分辨率匹配一致時效果最好。Windows中弓叛，電腦系統(tǒng)推薦的邏輯分辨率和物理分辨率是相等的彰居。同時可以看到系統(tǒng)提供了很多分辨率，系統(tǒng)提供最高的邏輯分辨率通常就是設備物理分辨率撰筷。知道物理分辨率和屏幕尺寸陈惰，就可以開開心心的算屏幕PPI了）
但是如果有人問你物理分辨率和邏輯分辨率是什么，肯定不能回答毕籽，物理分辨率就是屏幕那個抬闯，邏輯分辨率就是操作系統(tǒng)那個，所以我們需要繼續(xù)打破砂鍋問到低关筒。
物理分辨率：簡單的理解物理分辨率就是一塊屏幕每英寸最多能呈現(xiàn)的像素點數(shù)溶握。物理分辨率和屏幕尺寸沒有關系，比如我電腦是15.6寸蒸播，分辨率是1920*1080的奈虾，但是我手機只有5.99寸，分辨率也是1920*1080廉赔。它不是一個視覺單位肉微，簡單理解是一個個的物理像素點，也不能理解為長度單位蜡塌。只能用來描述點的個數(shù)碉纳，不能描述長度。
剛才計算了我電腦的PPI=141（每英寸最多可以呈現(xiàn)141個像素點）馏艾，現(xiàn)在假設在我電腦屏幕上切下一塊一英寸的正方形劳曹，那么這塊正方形小屏幕最多能呈現(xiàn)141*141=19881個像素點奴愉，這是沒有任何問題的。假如有另一塊一英寸的屏幕铁孵，這塊屏幕的做工更加精細锭硼，使用的技術牛筆，PPI竟然達到了227蜕劝，那么這個一英寸的屏幕最多能呈現(xiàn)的像素點數(shù)就是：227*227=51529個檀头。所以同樣大小的兩塊屏幕，PPI越大岖沛，能呈現(xiàn)的像素點就越多暑始，物理分辨率也就越大。所以說PPI是衡量一塊屏幕顯示效果的一個重要參數(shù)婴削。
而邏輯分辨率和物理尺寸有關廊镜，簡單理解就是一個長度單位，如果往深層次的說唉俗，這和柵格渲染有關系嗤朴。邏輯分辨率和物理分辨率有一種對應關系，后面移動設備分辨問題我會解釋〕媪铮現(xiàn)在繼續(xù)先來簡單理解一下雹姊，還是用我電腦舉栗子。
我電腦分辨率1920*1080（現(xiàn)在我電腦物理分辨率和邏輯分辨率相等）吼渡，現(xiàn)在知道PPI=141容为，能求出我電腦是多少英寸的嗎？底下一片人都在說廢話寺酪，你剛才就是用你電腦分辨率和15.6求的PPI=141坎背。如果現(xiàn)在我們有一張1920*1080的壁紙，那么用PS工具什么的寄雀，都可以量出144px的長度就是一英寸得滤。但是這并不能代表1920*1080邏輯分辨率對應的就是15.6英寸的設備，現(xiàn)在如果在另個設備PPI=375盒犹，同理可以求出設備是5.8英寸的懂更，差不多和手機一樣大，這時我們需要量出375px急膀，才是一英寸的長度沮协。邏輯分辨率可以表示長度，但是它和設備的PPI有很大的關系卓嫂。
如果你覺得還是不能理解慷暂，可以繼續(xù)看下面的例子：
現(xiàn)在有一張141*141分辨率的圖片，那么在我電腦上這張圖片顯示的大小就是一英寸的矩形晨雳，因為我電腦每英寸可以呈現(xiàn)141個像素點行瑞，反過來說141個像素點在我電腦上就表現(xiàn)一英寸的大小〖橄伲現(xiàn)在將這圖片放在另一臺電腦上，電腦屏幕尺寸和我電腦相同血久，但是PPI=70突照。那么圖片在屏幕顯示長度是幾英尺？2英寸Ｑ跬隆（如果答對了讹蘑，你就可以放過下面這個例子，不用看了）
如下圖A屏和B屏副砍，假設都是一英寸大小衔肢，A屏每英寸可以顯示兩個像素點庄岖，B屏可以顯示四個像素點』眙幔現(xiàn)在有一張4*4像素的圖片，在B屏剛好完美呈現(xiàn)隅忿，但是在A屏想完整顯示心剥，A屏向右需要再加兩個兩素點，向下再加兩個像素點背桐。所以在A屏上需要兩英寸优烧。
總結：邏輯分辨率這塊可能是有點不好理解，很抽象链峭，如果糾結很久還是不清楚畦娄，也不用糾結了，下面實戰(zhàn)篇會給出具體的例子弊仪。
蘋果筆記本電腦畫面為什么比普通筆記本電腦看著更舒服熙卡？
單從硬件上面看，蘋果電腦屏幕物理分辨率就已經(jīng)比普通電腦物理分辨率高出很多励饵。當然你肯定要說為什么要拿蘋果最好的設備去比較驳癌。我朋友用的是macbook air ，13.3,1440*900役听，但是畫面呈現(xiàn)效果依然比普通電腦好很多颓鲜。屏幕是一個因素，但是不是絕對的典予，屏幕的畫面顯示效果還和操作系統(tǒng)甜滨、顯卡很多因素有關。蘋果系統(tǒng)的圖形渲染技術就是全世界最好的瘤袖，所以蘋果屏幕所呈現(xiàn)的畫質(zhì)自然要比普通屏幕看起來更細膩更舒服衣摩。
常見的240p、360p孽椰、720p昭娩、1080p什么意思?
144p (192×144凛篙，20幀/秒)，4：3栏渺，錄制一分鐘大約1MB呛梆；
240p (320×240，20幀/秒)磕诊，4：3填物，錄制一分鐘大約3MB；
360p (480×360霎终，20幀/秒) 滞磺，4：3，錄制一分鐘大約7MB莱褒；
480p (640×480击困，20幀/秒)，4：3广凸，錄制一分鐘大約12MB阅茶；高清
720p (1280×720，30幀/秒) 谅海， 16:9脸哀，錄制一分鐘大約35MB；超清
1080p (1920×1080扭吁，30幀/秒) 撞蜂，16:9 ， 錄制一分鐘大約80MB侥袜。藍光
除此之外還有更高的分辨率：
2K （1152 × 2048）
4K（2304 × 4096）
三蝌诡、移動設備分辨率問題
像素你真的會嗎？（px系馆、dp送漠、pt、rpx由蘑、rem）-移動設備分辨率問題
參考資料：
1闽寡、像素維基百科
2、A pixel is not a pixel is not a pixel
3尼酿、前端工程師需要明白的「像素」
4爷狈、Syntax and basic data types
5、像素密度的危機
每月更新兩篇裳擎，質(zhì)量保證涎永！
