移動端flexible佈局適配

最近我的大學朋友居然問我移動端怎麼寫,我十分的驚訝,然後想到不會寫移動端的人也是比較多,那就說下吧。

首先下載flexible
然後下載sublime text3因爲sublime3有寫移動端的法寶cssrem
我就不說這個sublime3怎麼下載啦,直接說這個cssrem在哪裏下載吧

下載

第一種:cssremSublime Text -> Preferences -> Browse Packages,複製下載的cssrem目錄到剛纔的packges目錄裏
第二種:preferences->package control(install package)->cssrem安裝就完了

配置

  1. 打開preferences->browse packages->打開cssrem->cssrem.sublime-settings
    這裏寫圖片描述
    2.如果是750的設計圖就改成75,如果是640的就改成64就ok
    3.開寫,一定要在css裏面寫哦
    這裏寫圖片描述

    我這裏是750的設計圖所以我用的是75,直接回車就px自動轉成rem了
    哦,對了,不要忘了引入viewport

    <meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1″>

    width:控制 viewport 的大小,可以指定的一個值,如果 600,或者特殊的值,如 device-width 爲設備的寬度(單位爲縮放爲 100% 時的 CSS 的像素)。
    height:和 width 相對應,指定高度。
    initial-scale:初始縮放比例,也即是當頁面第一次 load 的時候縮放比例。
    maximum-scale:允許用戶縮放到的最大比例。
    minimum-scale:允許用戶縮放到的最小比例。
    user-scalable:用戶是否可以手動縮放

鄙人拙見,如有出入,還請指正,謝謝!!!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章