這篇文章主要介紹css中px指的是什么單位，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

創(chuàng)新互聯(lián)建站長期為千余家客戶提供的網(wǎng)站建設服務，團隊從業(yè)經(jīng)驗10年，關注不同地域、不同群體，并針對不同對象提供差異化的產(chǎn)品和服務；打造開放共贏平臺，與合作伙伴共同營造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為彭州企業(yè)提供專業(yè)的網(wǎng)站制作、成都網(wǎng)站設計，彭州網(wǎng)站改版等技術服務。擁有十余年豐富建站經(jīng)驗和眾多成功案例,為您定制開發(fā)。

在css中，px全稱pixel，中文意思為“像素”，是計算機系統(tǒng)的數(shù)字化圖像長度單位，是一個相對長度單位，是相對于屏幕顯示器分辨率而言的。典型的電腦顯示器的分辨率是96DPI，也就是1像素為“1/96”英寸。

本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

px是pixel的縮寫，是像素單位，也是為影像顯示的基本單位，譯自英文“pixel”，pix是英語單詞picture的常用簡寫，加上英語單詞“元素”element，就得到pixel，故“像素”表示“畫像元素”之意，有時亦被稱為pel（picture element）。

px (pixel，像素)：是一個虛擬長度單位，是計算機系統(tǒng)的數(shù)字化圖像長度單位，如果px要換算成物理長度，需要指定精度DPI(Dots Per Inch，每英寸像素數(shù))，在掃描打印時一般都有DPI可選。Windows系統(tǒng)默認是96dpi，Apple系統(tǒng)默認是72dpi。

在CSS中，px是一個相對長度單位，是相對于屏幕顯示器分辨率而言的。

• 在同樣一個設備上，每1個CSS像素所代表的物理像素是可以變化的(即CSS像素的第一方面的相對性);

• 在不同的設備之間，每1個CSS像素所代表的物理像素是可以變化的(即CSS像素的第二方面的相對性);

不同的設備，其圖像基本單位是不同的，比如顯示器的點距，可以認為是顯示器的物理像素?，F(xiàn)在的液晶顯示器的點距一般在0.25mm到0.29mm之間。而打印機的墨點，也可以認為是打印機的物理像素，300DPI就是0.085mm，600DPI就是0.042mm。

注意，我們通常所說的顯示器分辨率，其實是指桌面設定的分辨率，而不是顯示器的物理分辨率。只不過現(xiàn)在液晶顯示器成為主流，由于液晶的顯示原理與CRT不同，只有在桌面分辨率與物理分辨率一致的情況下，顯示效果最佳，所以現(xiàn)在我們的桌面分辨率幾乎總是與顯示器的物理分辨率一致了。

按照CSS規(guī)范的定義，CSS中的px是一個相對長度，它相對的，是viewing device的分辨率。這個viewing device，通常就是電腦顯示器。典型的電腦顯示器的分辨率是96DPI，也就是1像素為1/96英寸（實際上，假設我們的顯示器分辨率都與物理分辨率一致，而液晶點距其實是0.25mm到0.29mm之間，所以不太可能是正好1/96英寸，而只是接近）。

一般來說，px就是對應設備的物理像素，然而如果輸出設備的解析度與電腦顯示器大不相同，輸出效果就會有問題。例如打印機輸出到紙張上，其解析度比電腦屏幕要高許多，如果不縮放，直接使用設備的物理像素，那電腦上的照片由600DPI的打印機打出來就比用顯示器看小了約6倍。

所以CSS規(guī)定，在這種情況下，瀏覽器應該對像素值進行縮放調(diào)節(jié)，以保持閱讀體驗的大體一致。也就是要保持一定像素的長度在不同設備輸出上看上去的大小總是差不多。

怎樣確保這一點呢？直接按照設備物理像素的大小進行換算當然是一個方式，但是CSS考慮得更多，它建議，轉(zhuǎn)換應按照“參考像素”（reference pixel）來進行。

眼睛看到的大小，取決于可視角度。而可視角度取決于物體的實際大小以及物體與眼睛的距離。10米遠處一個1米見方的東西，與1米遠處的10厘米見方的東西，看上去的大小差不多是一樣的，所謂一葉障目不見泰山，講的就是這個常識。

因此CSS規(guī)范使用視角來定義“參考像素”，1參考像素即為從一臂之遙看解析度為96DPI的設備輸出（即1英寸96點）時，1點（即1/96英寸）的視角。

請注意這個差別——CSS規(guī)范定義的參考像素并不是1/96英寸，而是1/96英寸在一臂之遙的看起來的視角。通常認為常人臂長為28英寸，所以其視角可以計算出來是0.0213度。（即(1/96)in / (28in * 2 * PI / 360deg) ）

我們在使用不同設備輸出時，眼睛與設備輸出的典型距離是不同的。比如電腦顯示器，通常是一臂之距，而看書和紙張時（對應于打印機的設備輸出），則通常會更近一些?？措娨晻r則會更遠，比如一般建議是電視機屏幕對角線的2.5到3倍長——如果你是個42'彩電，那就差不多是3米遠?？措娪暗脑挕揖筒恢蓝噙h了，您自己量吧。

因此，1參考像素：

對于電腦顯示器是0.26mm（即1/96英寸）；

對于激光打印機是0.20mm（假設閱讀距離通常為55cm，即21英寸）；

而換算時，對于300DPI的打印機（即每個點是1/300英寸），1px通常會四舍五入到3dots，也就是0.25mm左右；而對于600DPI的打印機，則可能四舍五入到5dots，也就是0.21mm。

綜上，px是一個相對單位，而且在特定設備上總是一個近似值（原則是盡量接近參考像素）。

然而，如果你把絕對單位理解為對輸出效果的絕對掌控，事情卻大相徑庭。就網(wǎng)頁輸出的最主要對象——電腦屏幕來說，px可被視為一個基準單位——與桌面分辨率一致，如果是液晶屏，則幾乎總是與液晶屏物理分辨率一致——也就是說網(wǎng)頁設計者設定的1px，就是“最終看到這個網(wǎng)頁的用戶的顯示器上的1個點距”！反倒是那些絕對單位，其實一點也不絕對。

因為絕對單位比如cm或者pt，顯示在屏幕上時最后還是要換算為像素，而且這種換算不是按照像素的實際物理長度來換算的（瀏覽器不用知道，也不可能知道當前這臺顯示器的1px物理長度到底是多少），而是按照桌面設定的DPI計算的。也就是說，網(wǎng)頁設計者指定某個字體是12pt（即1/6英寸或4.2mm），實際上你量量屏幕，幾乎不可能是正好12pt，而只是接近12pt的16px（按照96DPI換算）而已。如果你的屏幕點距是0.29mm，則實際上是4.64mm或13.15pt。假如你把桌面改為大字體（120DPI），則最終12pt相當于20px，按照0.29mm點距，最終效果是16.44pt。

過去，建議網(wǎng)頁設計者不要使用px，一個原因就是基于用戶可以根據(jù)自己的需要調(diào)節(jié)桌面DPI，從而控制絕對長度的實際長度（繞口令啊）。

然而這其實是可疑的。既然絕對長度的實際長度可以根據(jù)需要調(diào)節(jié)，沒有理由px這樣一個相對長度不能根據(jù)需要調(diào)節(jié)。就好像照片在實際打印時你當然可以根據(jù)需要縮放一樣，以px設定的字體和圖像在實際顯示時完全可以進行縮放——這時網(wǎng)頁設計者指定的1px就不再對應于用戶桌面的1px，而是可能對應1.2px或1.5px或其他值。

過去瀏覽器的調(diào)節(jié)字體大小的選項只對絕對長度有效（相當于調(diào)節(jié)瀏覽器內(nèi)部的DPI），對px無效，這只能說是過去瀏覽器的設計問題，并不是px的固有問題?，F(xiàn)在瀏覽器都已經(jīng)支持針對以px設定的字體的縮放了。像Firefox，用戶還可以選擇是單單縮放字體，還是連圖片一塊兒縮放。所以全部使用px的“像素級精確設計”完全是可行的，也是我認為合理的設計方式。畢竟，CSS中的px本來就是要確保一致的閱讀體驗。至于是流式布局還是固定布局，是否能適應不同的分辨率，那是另一個話題，與是否使用px作為單位并沒有直接關聯(lián)。

以上是“css中px指的是什么單位”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

分享文章：css中px指的是什么單位
轉(zhuǎn)載來于：http://jinyejixie.com/article14/jjpgge.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站收錄、響應式網(wǎng)站、網(wǎng)站導航、移動網(wǎng)站建設、企業(yè)網(wǎng)站制作、定制開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)