如今主流手機(jī)屏幕的像素點(diǎn)數(shù)遠(yuǎn)遠(yuǎn)超過(guò)了桌面顯示器的像素?cái)?shù)量铝量，5.5英寸的1920*1080P的手機(jī)與一個(gè)21英寸的1920*1080P的顯示器相比钮孵，同等面積下强经，手機(jī)的像素點(diǎn)更密集，可想而知掺涛，在手機(jī)屏幕下庭敦，一個(gè)像素點(diǎn)是非常小的。
那么在css中設(shè)置font-size:12px薪缆，如果手機(jī)屏幕物理像素：css像素=1：1秧廉，那么手機(jī)上展示出來(lái)的自己你可能需要放大鏡才能看得清，但為什么如今的手機(jī)屏幕能清晰的顯示拣帽？
答案就是：css中的px與屏幕上的物理像素px是不等同的疼电。所以devicePixelRatio應(yīng)運(yùn)而生：dpr=設(shè)備像素/css像素。
邏輯分辨率與物理分辨率
由于以上是物理像素尺寸差異導(dǎo)致的問(wèn)題减拭，所以我們必須在小的設(shè)備上放大蔽豺，也就是說(shuō)用多個(gè)物理像素來(lái)顯示一個(gè)電子像素，從而保證閱讀質(zhì)量拧粪。
dpr=設(shè)備像素/css像素修陡。
它描述的是未縮放狀態(tài)下，設(shè)備像素和css像素的初始比例關(guān)系可霎，也可以解釋為默認(rèn)縮放比例魄鸦。通俗來(lái)說(shuō)，它是在開(kāi)發(fā)中1個(gè)css像素占用多少設(shè)備像素癣朗。如dpr=2拾因，代表一個(gè)1個(gè)css像素用2*2個(gè)設(shè)備像素來(lái)繪制，這是因?yàn)閞etina屏幕把2*2當(dāng)1個(gè)像素使用，比如原本44像素高的頂部導(dǎo)航欄绢记，在retina屏用了88個(gè)像素高度來(lái)顯示扁达，導(dǎo)致頁(yè)面元素都變成了2倍大小。
