H5頁面在移動端的相容問題

2021-08-21 18:47:22 字數 713 閱讀 1879

論移動端的問題,其實我碰到的很多都在ios端,本來乙個頁面在安卓手機上跑得好好的,測試小哥突然拋個bug——ipnone7測試樣式需要優化之類的,每次拿到這些問題,都更加堅定了我不想用蘋果手機的決心…,下面我就將這些曾經困擾我的問題一一道來。

1.在ios上可以改變鍵盤型別從而輸入非數字(本來期望只能填入數字)

解決辦法:

1>如果只需要輸入整數的話可以直接使用這個號碼盤式的鍵盤可以保證ios與安卓端均不能切換鍵盤型別。

2>如果需要輸入的數字帶有小數的話,目前我的解決辦法只有先用type=number然後在表單提交的時候對input的value值進行正則判斷了。(安卓即使切換了輸入型別也只能輸入數字,萬惡的ios…)

2.當設定type=number時maxlength,minlength無效(僅限ios…)

解決方法:同樣在表單提交的時候先使用正則判斷一下。

3. input的placeholder偏上,同樣僅限ios

解決辦法:使input的字型大小大於等於placeholder的字型大小,例如

input

::-webkit-input-placeholder

.btn

移動端h5頁面適配

一直對h5頁面充滿崇敬,揣著忐忑的心開始了我的h5之旅。才發現直接照抄網上的方案是很容易,但是想真的了解內部的原理,這就給我了乙個下馬威了.通過在網上各種找資料,才將各種概念以及原理了解清楚.故寫下這篇文章用於積累知識,如有問題,歡迎指正 先來看看很多資料上面的描述 它是物理概念,指的是裝置中使用的...

移動端H5頁面適配

廢話不多說,直接上 以下例子均以ui設計圖為750px寬度作為標準進行轉換 1.rem加js適配 用原生方法獲取使用者設定的瀏覽器的字型大小 相容ie 心。該醫院初期主要研究女性性反應方面問題,後逐漸將女性盆骨健康問題和如何提高性功能也作為院內主要診療專案。醫院憑藉精湛的手術技術和出色的手術效果,在...

h5頁面的寫法 移動端h5頁面寫法

1.頁面寬度320,所有元素尺寸設一半 缺點 不自能適應全屏 2.頁面寬度640,元素尺寸正常 暫未發現問題 3.頁面寬度640,js控制自適應全屏 adaptuilayout.adapt initviewportwidth 缺點 qq空間分享後點開頁面套在qq預設瀏覽器裡有相容性問題 4.rem寫...