## # 手機端怎么適配？ # 【02】手機端怎么適配？ ① 頁面mata標簽 設置viewport用戶網頁的可視區域 ~~~ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"> ~~~ ## 屬性值詳解 width=device-width：寬度等于設備寬度 initial-scale：初始縮放比例，也即是當頁面第一次 load 的時候縮放比例。 maximum-scale：允許用戶縮放到的最大比例。 minimum-scale：允許用戶縮放到的最小比例。 user-scalable：用戶是否可以手動縮放。 ② 使用rem 單位 rem是指相對于根元素（即html元素）的字體大小的單位。 ③ 使用flex布局及響應式布局 Flex彈性和布局能夠非常靈活的應對各種屏幕分辨率的適配 響應式布局兼容性好，可以跨平臺，但是代碼冗余，浪費流量，在大型網站不建議使用。