• 移動應用、小程序開發
    您現在的位置:首頁 ? 公司博客 ? DPI和像素、厘米、英寸之間的關系和換算及CSS中的長度單位

    DPI和像素、厘米、英寸之間的關系和換算及CSS中的長度單位

     

    首先告訴大家一個不幸的消息:像素不能直接換算成英寸、厘米,要在dpi下才能換算!

    photoshop中兩種分辨率換算
    72像素/英寸=28.346像素/厘米
    300像素/英寸=118.11像素/厘米

    1 厘米=0.3937 英寸 
    1 英寸=2.54 厘米

    以常見1024像素對比:

    1024像素=3.413英寸=8.67厘米         (300像素/英寸dpi     每英寸≈0.003333像素)

    所以1024像素的厘米尺寸就是:1024*0.003333*2.54

    1024像素=14.222英寸=36.12厘米         (72像素/英寸dpi     每英寸≈0.013889像素)

    所以1024像素的厘米尺寸就是:1024*0.013889*2.54

    提起分辨率,我們需要了解兩個概念,圖像分辨率和輸出分辨率,圖像分辨率是每英寸的像素數,以ppi為單位,圖像分辨率又常常被表示成每一個方向上的總像素數量,比如640×480像素、1280×960像素等。而決定圖像輸出質量的是圖像的輸出分辨率,描述的是設備輸出圖像時每英寸可產生的點數(dpi),以dpi為單位,兩者有聯系但并不總是相等的。

    dpi (dot per inch)輸出分辨率
    打印機分辨率又稱為輸出分辨率,是指在打印輸出時橫向和縱向兩個方向上每英寸最多能夠打印的點數,通常以“點/英寸”即dpi(dot per inch)表示。而所謂最高分辨率就是指打印機所能打印的最大分辨率,也就是所說的打印輸出的極限分辨率。平時所說的打印機分辨率一般指打印機的最大分辨率,目前一般激光打印機的分辨率均在600×600dpi以上。

    dpi是“dot per inch”的縮寫。顧名思義,就是指在每英寸長度內的點數。通常,我們都使用dpi來作為掃描器和打印機的解析度單位,數值越高表示解析度越高。目前,市面上出售掃描器的光學解析度主要有600×1200 dpi和1200×2400 dpi兩種。掃描器的光學解析度由兩個數字構成,是因為橫向解析度和縱向解析度不同。較小的數字通常為縱向解析度,即我們一般區分掃描器解析度用的數值。也就是說,600×1200 dpi的掃描器,我們通常簡稱為600 dpi。

    電腦顯示器的解析度約為72dpi,這個數值其實是這樣計算出來的:以一部15寸的電腦顯示器為例,可視面積的水平長度大約為11.2寸,如果顯示模式是800×600,那么解析度就是800/11.2=71.4。如果是17寸電腦顯示器,以1024×768的顯示模式來看,解析度就變成1024/12.8=80了。

    像素(Pixel)
    對于計算機的屏幕設備而言,像素(Pixel)或者說px是一個最基本的單位,就是一個點。其它所有的單位,都和像素成一個固定的比例換算關系。所有的長度單位基于屏幕進行顯示的時候,都統一先換算成為像素的多少,然后進行顯示。所以,就計算機的屏幕而言,相對長度和絕對長度沒有本質差別。任何單位其實都是像素,差別只是比例不同。

    如果把討論擴展到其它輸出設備,比如打印機,基本的長度單位可能不是像素,而是其它的和生活中的度量單位一致的單位了。

    CSS絕對長度單位是對于輸出設備(output device)而言的。拿pt來說,這是一個在文字排版工具(word,adobe等)中非常常用的字體單位,不管你的顯示器分辨率是1024*768,還是800*600,同一篇文檔打印在紙面上的結果是一樣的。

    寫網頁用哪個長度單位更好,是px還是pt呢?

    我個人比較偏向px,因為px能夠精確地表示元素在屏幕中的位置和大小,網頁主要是為了屏幕顯示,而不是為了打印等其它需要的。

     

    CSS相對長度單位(relative length unit)

    CSS相對長度單位中的相對二字,表明了其長度單位會隨著它的參考值的變化而變化,不是固定的。

    以下是CSS相對長度單位列表:

    CSS相對長度單位
    說明

    em     元素的字體高度The height of the element's font

    ex     字母x的高度The height of the letter "x"

    px     像素Pixels

    %     百分比Percentage

     

    CSS絕對長度單位(absolute length unit)

    絕對長度單位是一個固定的值。比如我們常用的有mm,就是毫米的意思。

    以下是CSS絕對長度單位列表:

    CSS絕對長度單位
    說明

    in      英寸Inches (1 英寸 = 2.54 厘米)

    cm    厘米Centimeters

    mm   毫米Millimeters

    pt     點Points (1點 = 1/72英寸)

    pc     皮卡Picas (1 皮卡 = 12 點)

    像素是相對于顯示器屏幕分辨率而言的。譬如,WiNDOWS的用戶所使用的分辨率一般是96像素/英寸。而MAC的用戶所使用的分辨率一般是72像素/英寸。

    所以在WiNDOWS的CSS中 dpi為 96像素/英寸

    99V久久综合狠狠综合久久