固定欄靠前

所謂的固定欄，也就是帶有.mui-bar屬性的節點，都是基於fixed定位的元素；常見組件包括：頂部導航欄（.mui-bar-nav）、底部工具條(.mui-bar-footer)、底部選項卡（.mui-bar-tab）;這些元素使用時需遵循一個規則：放在.mui-content元素之前，即使是底部工具條和底部選項卡，也要放在.mui-content之前，否則固定欄會遮住部分主內容；

一切內容都要包裹在mui-content中

除了固定欄之外，其它內容都要包裹在.mui-content中，否則就有可能被固定欄遮罩，原因：固定欄基於Fixed定位，不受流式布局限制，普通內容依然會從top:0的位置開始布局，這樣就會被固定欄遮罩，mui為了解決這個問題，定義了如下css代碼：

    .mui-bar-nav ~ .mui-content {  
        padding-top: 44px;  
    }  
    .mui-bar-footer ~ .mui-content {  
        padding-bottom: 44px;  
    }  
    .mui-bar-tab ~ .mui-content {  
        padding-bottom: 50px;  
    }  

你當然可以通過自定義CSS的方式實現如上類似效果，但為了使用簡便，建議將除固定欄之外的所有內容，全部放在.mui-content中。

始終為button按鈕添加type屬性

若button按鈕沒有type屬性，瀏覽器默認按照type=submit邏輯處理，這樣若將沒有type的button放在form表單中，點擊按鈕就會執行form表單提交，頁面就會刷新，用戶體驗極差。

窗口管理

頁面初始化：必須執行mui.init方法

mui在頁面初始化時，初始化了很多參數配置，比如：按鍵監聽、手勢監聽等，因此mui頁面都必須調用一次mui.init()方法；

頁面跳轉：拋棄href跳轉

當瀏覽器加載一個新頁面時，若頁面DOM尚未渲染完畢，頁面會先顯示空白，然後等DOM渲染完畢後，再顯示具體內容，這是WEB瀏覽器技術無法逾越的體驗障礙；為解決這個問題，建議使用mui.openWindow方法打開一個新的webview，mui會自動監聽新頁面的loaded事件，若加載完畢，再自動顯示新頁面；

頁面關閉：勿重復監聽backbutton

mui框架自動封裝了頁面關閉邏輯，若希望自定義返回邏輯（例如編輯頁面的返回，需用戶確認放棄草稿後再執行返回邏輯），則需要重寫mui.back方法，切勿簡單通過addEventListener添加backbutton監聽，因為addEventListener只會增加新的執行程序，mui默認封裝的監聽執行邏輯依然會繼續執行，因此若僅addEventListener添加用戶確認框，則用戶即使選擇了取消，也會繼續關閉窗口。

手機APP開發mui註意事項