1.rem
rem都知道，是根據跟元素大小更改，所以我們一般會用這個來適用各種屏幕，畢竟是按照比例來的，還是挺不錯的
但是現在pc端ui設計一般都是1920X不確定高度，高度好說都是有多高就多高，寬度1920，多出的就是爲了適用，一般主要內容是1200的寬度。
在vue裏搭建好之後就新建一個rem.js的文件夾，裏面寫上這樣
! function(n) {
var e = n.document,
t = e.documentElement,
i = 1200,
d = i / 100,
o = "orientationchange" in n ? "orientationchange" : "resize",
a = function() {
var n = t.clientWidth || 600;
n > 1200 && (n = 1200);
t.style.fontSize = 1200 / d + "px"
};
e.addEventListener && (n.addEventListener(o, a, !1),
e.addEventListener("DOMContentLoaded", a, !1))
}(window);
然後在main.js裏引入
import './Vuex/rem' //我是項目裏用了vuex,就把這個方vuex文件夾裏了
然後在寫的時候元素寬高除以100就是了，比如你現在元素寬1200px，用這個就是12rem
當然上面的n和1200是能改的，看你們ui啥情況了，移動端也可以，我們ui移動用的375，但是不好算，ui給的網站能調，改成了750，上面的n也要改成750，這樣也是100的比例
2.瀏覽器縮放問題
其實移動端也遇見過一些網頁，當你點輸入框的時候就會放大縮小，樣式錯亂，就需要這樣一行代碼，寫在<head>裏
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0, user-scalable=no">
但是pc並沒什麼用 vue裏的話是<meta name="viewport" content="width=device-width,initial-scale=1.0">，把後面兩句在index.html里加上就可以了。
但是pc不生效，我找了一些網上了方法，原生js控制，感覺有點麻煩，然後就想到了上面rem的那一串代碼就改了一下
! function(n) {
var e = n.document,
t = e.documentElement,
i = 1200,
d = i / 100,
o = "orientationchange" in n ? "orientationchange" : "resize",
a = function() {
// var n = t.clientWidth || 600;
// n > 1200 && (n = 1200);
t.style.fontSize = 1200 / d + "px"
};
e.addEventListener && (n.addEventListener(o, a, !1),
e.addEventListener("DOMContentLoaded", a, !1))
}(window);
註釋的地方就是需要刪掉的，把下一行的n改成1200，直接寫死，就是適應1200，再小就不管了。
不再適應，這樣就不擠了，因爲只是用在pc端，也沒什麼影響
或者綁上面那個||600g改成||1200也可以
然後在index最外層寫上
{min-width:1200px；overflow:auto}
這個就是寫最大1200px超出滑動