場景
Vue搭建的大屏項目，設定的屏幕分辨率為1920x1080。
現需要將該項目適配分辨率為1024x768的分辨率
CSS中的px稱為邏輯像素 ：
也叫設備獨立像素（Device Independent Pixel, DIP），可以理解為反映在CSS代碼里的像素點數。
屏幕的分辨率是物理像素：
設備屏幕實際擁有的像素點。比如iPhone 6的屏幕在寬度方向有750個像素點，高度方向有1334個像素點，所以iPhone 6總共有750*1334個物理像素。
兩者之間是通過一個DPR來聯系的，DPR = 物理像素 / 邏輯像素
以前，CSS里寫個1px，屏幕就給你渲染成1個實際的像素點，DPR= 1
Retina技術用4個乃至更多物理像素來渲染1個邏輯像素，同樣的CSS代碼設置的尺寸，
在Retina和非Retina屏幕上看起來大小是一樣的，但在Retina屏幕上要精細得多。
注：
博客：
https://blog.csdn.net/badao_liumang_qizhi
關注公眾號
霸道的程序猿
獲取編程相關電子書、教程推送與免費下載。
實現
1、我本機是1920x1080的分辨率，怎么模擬調試1024x768的分辨率。
運行項目，在谷歌瀏覽器中打開調試，然后縮放窗體，查看右上角的大小顯示
然后就可以調整成對應的大小，進而調整代碼中css的px大小，直到達到想要的效果。
2、示例
