結合工作中**量的積累以及測試童鞋反饋的優化或bug,記錄和總結常見問題:
一、fixed定位的問題
當頁面總體布局出現頭尾fixed後,輸入框獲取焦點時,會出現頁面排版錯亂。
養成乙個好的習慣:用absolute代替,最外層放乙個全屏盒子,中間可以分成三個absolute的盒子,內容放在中間盒子。如有彈出層,則寫在最外層盒子裡面。
在需要相容到ie678的pc頁面也可以用這種方式。
初始化頁面時document.getelementsbytagname('body')[0].addeventlistener('touchmove',function(e),false);
去除body的滑動事件。
三、不同解析度下相容性問題,一般指相容ipad phone
採用rem定位,包括除邊框外的px定位全轉換成rem。
如ui設計圖是750px寬,則將html標籤的字型大小設定為屏寬除以7.5;
function setrootfontsize()
$(window).on('load resize',setrootfontsize);
如此後設計圖上的100px寬的圖,就是1rem寬。30px的間隔就是0.3rem,類推。
需要設定的是width,height,line-height,padding,margin,font-size,border-radius等
四、為什麼邊框1px感覺太寬了
所有需要細邊框的元素,應該有個邊框的class
underline
:after
五、css向右鍵頭
.icon-arrow:after
六、瀏覽器會預設有幾個畫素的邊距,應該初始化*
七、控制項注意事項
input type="tel"呼叫數字按鍵
寫完要寫常用驗證,maxlength
//todo
H5問題總結
很多時候設計稿中的icon很小,但是實際製作頁面時,如果這個icon可操作,icon的可操作域應該做大一些,不然在裝置中會經常發生操作之後沒反應 其實是沒有觸發在操作域上 少掉坑,h5建議 0.很多時候設計稿中的icon很小,但是實際製作頁面時,如果這個icon可操作,icon的可操作域應該做大一些...
H5頁面常見開發問題總結
摘要 常見的通用的h5開發問題 ios端 h5開發問題 輸入法隱藏頁面留白 問題現象 ios端軟鍵盤失去焦點 隱藏 後,頁面不會回彈,頁面下方會留下輸入法塊的白色塊。暴力解決方案 軟鍵盤收起 隱藏 後,滾動一下頁面,頁面中的留白塊塊就會消失。所以只要在輸入完畢後實現一下 滾動 的操作就可以解決問題。...
H5開發問題總結
local 和session 都無法直接訪問物件,當你定義乙個 json 以後 通過setitem 和getiem 後發現無法正常使用,應為local session 都是支援字串的訪問,所以這是需要兩個步驟第一就是在存的時候吧json 轉化成字串,當取出的時候再把字串解析成json 例如 var ...