移動端 項目開發經驗集錦

本次要與大家分享的是，在項目開發過程中，移動端遇到的各種問題~本文主要與大家分享移動端開發經驗，主要包括表單兼容（fixed定位的input存在的問題、iPhone、iPad的按鈕默認樣式、默認高光樣式的處理、關閉iOS中鍵盤自動大寫等）、HTML、CSS、JS（移動端禁止電話號碼、郵箱的自動識別、click事件的300ms延遲問題、元素點擊高亮樣式的處理、模擬手機聯系人觸摸a~z導航）的功能；瀏覽器內核與內核前綴。

瀏覽器內核與內核前綴

不同的瀏覽器有不同的渲染引擎，也就是內核。不同的瀏覽器內核對網頁編寫語法的解釋也有不同，因此同一網頁在不同的內核的瀏覽器里的渲染（顯示）效果也可能不同，這也是前端工程師需要了解內核的原因。前端工程師在代碼中通過一些內核前綴為相應瀏覽器增加某些功能。換句話說，內核前綴標志著某種類的瀏覽器，使用內核前綴書寫的代碼只能夠應用于相應瀏覽器。那么常見的瀏覽器分別是什么內核，在書寫時內核前綴又應當如何書寫？請看——>《瀏覽器內核以及內核前綴》

移動端 表單兼容的開發經驗

表單的兼容一直是眾多開發工程師心煩的一件事，在《移動端項目經驗 表單兼容（上篇）》與《移動端項目經驗 表單兼容（下篇）》兩篇文章中主要為大家分享了，既介紹了存在哪些問題，也提到了解決問題的方式和方法：

1、fixed定位的input存在的問題；

2、iPhone、iPad的按鈕默認樣式；

3、IE10的文本框中的關閉按鈕；

4、默認高光樣式的處理；

5、調用相冊的按鈕樣式處理；

6、占位符 placeholder新屬性；

7、關閉iOS中鍵盤自動大寫。

移動端 HTML、CSS、JS開發經驗

在《移動端開發經驗 HTML與CSS兼容》與《移動端開發經驗 JavaScript》兩篇文章當中，主要從HTML、CSS、JS角度書寫了遇到的開發問題。主要包括：

1、移動端禁止電話號碼、郵箱的自動識別；

2、橫向rem的相關問題；

3、click事件的300ms延遲問題；

4、元素點擊高亮樣式的處理；

5、zepto的touch問題。

6、模擬手機聯系人觸摸a~z導航——《移動端 模擬手機聯系人觸摸a~z導航》

移動端很常見的效果，類似于手機聯系人的快速導航功能，即當觸摸a~z的字母時，能夠相對應的顯示文字。有些手機的音樂導航也類似。

致謝

很感謝電腦前的你，將這篇文章從頭讀完，我們希望能夠為大家建立一個HTML5技術分享平臺，歡迎進入“HTML5學堂”溝通交流~~~HTML5學堂~http://www.h5course.com~由多名熱愛H5的講師們組成的一個組織。致力于構建一個前端技術、HTML5知識的分享平臺。

轉載于:https://www.cnblogs.com/h5course/p/4771701.html

總結

以上是生活随笔為你收集整理的移动端 项目开发经验集锦的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。