PC端/移動端常見的相容性問題總結

來源:互聯網
上載者:User

標籤:form   硬體加速   手機   模糊   mat   自動   透明度   sele   box   

移動端:

① 安卓瀏覽器看背景圖片,有些裝置會模糊,原因是手機的解析度太小

解決方案: 用2X圖片來代替img標籤,然後background-size: contain

② 防止手機中頁面放大或縮小: 在meta中設定viewport user-scalable = no

③ 上下拉捲軸卡頓: overflow-scrolling: touch;

④ 禁止複製選中文本: user-select: none;

⑤ 長時間按住頁面出現閃退:-webkit-touch-callout: none;

⑥ 動畫定義3D硬體加速: transform: translate 3d(0,0,0);

⑦ formate-detection 啟動或禁止自動識別頁面中的電話號碼,content = "yes/no"

⑧ a標籤添加tel是撥號功能

⑨ 安卓手機的圓角失效: background-clip: padding-box;

⑩ 手機端300ms延遲: fastclick

① 橫平時字型加粗不一致: text-size-adjust: 100%;

 

PC端:

① rgba不支援IE8 用opacity屬性代替rgba設定透明度

② 圖片加a標籤在IE9中出現邊框 解決方案: img{border: none;}

③ IE6不支援display: inline-block       設定為: display: inline

④ position : fixed 不支援IE5/IE6 

⑤ IE6,Firfox中,width = width + padding + border

⑥ min-height比相容IE6/IE7

 

PC端/移動端常見的相容性問題總結

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

Tags Index: