暫時有幾個常見的需要注意一下，防止被坑。
1、手機瀏覽器會突然縮小頂部欄或者乾脆消失。這是由於使用了瀏覽器預設滑動事件造成的。所以整體專案要麼都使用滑動事件，要麼就只使用touch滑動事件，比如better-scroll。
2、ios對h5css position屬性支援是有些問題的，比如fixed與input同時使用，會造成input獲得焦點fiexd布局失效，這是對fiexd不友好支援所造成。
3、布局是移動端的一大坑，特別是一些屬性其實很多手機廠商深度優化後的系統瀏覽器支援的不是很好，比如華為、魅族，像img span 這樣的標籤使用為了相容，最好加上display block display inline-block 屬性，因為block屬性基本都支援，但inline-block不一定支援，但如果不加block，只加inline-block會有問題的。
4、line-hieght一定要配合height使用，否則在一部分瀏覽器會不支援。
5、給img加100%屬性或者給img父標籤加100%屬性會在一部分瀏覽器出現相容性問題，最好加乙個具體值。
6、flex屬性在移動端支援的其實沒有那麼好，所以使用flex布局一定要加上block屬性。
7.在ios中對fixed支援的不是很好，在一些機型中又對absolute支援的不是很好，如果想避免相容問題，最好這兩個都不要用！相反flex雖然有些問題但大多數情況其實更好用！
暫時只想起這麼多，以後再加。
移動端的那些坑
首先我們來看乙個結構 div class header div div class main div div class footer textarea textarea div 其實就是最基本的上中下布局而已，問題是header和footer需要分別fixed到頭部和底部。遇到的都知道在ios的s...
移動端填坑
1 0.5px邊框或者0.5px高度在安卓手機下不顯示問題 item gap 2 display inline block不僅左右會有無法測量的間距，上下也會有，會影響文字3 直接在外面加1px的淺顏色邊框時，視覺上和邊框之間會有一條白線 把乙個帶邊框的透明層放到上，這樣當時是乙個有留白的時候是可以...
fixed在移動端的坑
fixed在某些情況下可能導致容器內的子元素的1px邊框線消失，即使使用z index也無法解決。解決方法 可以使用translatez屬性來解決 fixed定位的容器內不能帶有input，這是常見的bug。解決方法 在input聚焦的時候去掉fixed定位狀態，改為absolute。fixed 可...