最近在做移動端h5聊天應用發現，當input框在最底部並且使用 position:fixed 屬性的時候在蘋果手機中會出現不相容的情況
大概布局就是上面是列表 底部是input並基於瀏覽器定位放置於最底部
當點選輸入框的時候會出現input位置錯亂的情況
這裡出現了上移的情況
這裡出現了消失的情況，得滑動到最底下才會出現
首先把頁面分割成兩個塊組成列表滾動區和輸入區
首先把最外部的盒子設為``` flex ``` 盒子並且縱向排列,高度設為100%，就是和視窗一樣大小，高度獲取可以利用絕對定位或者給body設定100%高度繼承下來等等方法
display:flex;
flex-direction: column;
height:100%
}這樣就縱向排列了，把滾動區的盒子自動撐開就行了
flex: 1;
width: 100%;
overflow-y: scroll;
-webkit-overflow-scrolling:touch;
}底部設定高度
width: 100%;
height: 100rpx;
background: #fff;
}這樣就大功告成了目前專案執行中，暫未發現bug，小夥伴可以自行體驗下
最後打一波廣告：
crmeb**乙個免費開源專案
管理後台使用vue+iview框架
開源不易，希望各位關注下，說不定你會有意外收穫！
關於flex定位講解
首先我們要知道flex是我們移動端常用布局，當然pc端也可以，接下來我們了解一下flex 整體分為兩部分 一般情況下語法新增在父容器，即display flex 預設情況下，在彈性盒子元素中元素容器左右排列，即flex direction row 還有就是寫在子元素裡 接下來我們了解聽他的每乙個屬性...
利用Flex整合Microstrategy開發報表
最近接觸了很多東西，不停的配環境，每次版本問題都得折騰一番。microstrategy提供了乙個flex外掛程式，用來開發顯示報表資料的flash模板。利用flex開發簡單報表過程 1.安裝 microstrategy8.1 2.安裝flex builder 2.2。3.在flex builder中...
利用flex製作篩子
如果對flex布局不了解的或是有疑問的 核心 display flex flex direction column align items center justify content center justify content space around display flex 設定元素為彈性布...