类似的题目一搜一大堆,我就不再写那些meta标签类似的内容了,记录一下自己实现中遇到的问题,如果能帮到你,那再好不过了。

  • 1px border的问题,大家能搜到很多方案,但如何选择还是要根据实际情况,比如border-image不能处理圆角,最好用的transform scale可能会因为改变布局导致某些区域不可点。
  • 小于12px的文字的居中问题:完美解决移动Web小于12px文字居中的问题
  • 注意3d加速的使用 -webkit-perspective and -webkit-backface-visibility:移动Web轮播图IOS卡顿的问题
  • 如果transform或者动画引起文字锯齿或者其他的元素闪烁,也可以试试:-webkit-backface-visibility: hidden; -webkit-transform-style: preserve-3d;
  • background-image属性有些手机出现了莫名其妙的横线,使用background-size: 100% 100%;可解决, contain和cover都没用。
  • 点击穿透的问题,个人感觉最简单粗暴的方式还是直接改为click。。
  • android手机按钮长按会出现橘黄色的背景和边框,直接用span或者p之类的标签模拟按钮。
  • 如果要兼容到android2.3, 需要额外处理很多事情。比如transform、border-radius以及document.documentElement.clientWidth获取宽度(可使用window.innerWidth),如何判断系统低于2.3看完美解决移动Web小于12px文字居中的问题
  • 移动端屏幕适配:再谈移动端Web屏幕适配

易信4.0终于上线,大家可以体验一下。我在其中贡献了公众号精选页面,是客户端新增的部分,基于webview实现,效果是这样的:

现在没事就看看自己的页面,一方面经常推送优质内容, 一方面害怕出bug。。。囧

这次还使用了regular, 我厂内已经广泛使用,体积小使用简单。

唉, 怎么看怎么像一篇广告。

移动web开发的一些坑的更多相关文章

  1. 2017最新整理移动Web开发遇到的坑

    随着前端的热度不断升温,行业对前端的要求越来越高:精准无误的实现UI设计,已成为前端职业更加精细化的一种表现:随着移动互联网的发展.WebApp似乎一种不可逾越的鸿沟:越来越多的企业开始趋势于轻量级的 ...

  2. 移动端web开发的那些坑

    1.为非a列表项添加触感样式 通过js注册touchstart和touchend事件,添加触感class的方式, 有个坑,低版本的Android浏览器,经常触发不到touchend,需要再额外注册一个 ...

  3. 百思不得其解—这些年做Web开发遇到的坑?

     请教一个问题:Bootstrap 模态框modal里面的嵌入 iframe ,然后iframe 里面载入的是优酷的视频 ,现在的问题是:这个模态框在谷歌浏览器上面可以播放出视频,而在ff浏览器里面无 ...

  4. Web前端开发(基础学习+坑)

    0.基本说明 0.内容为课堂所学基本知识,加自己踩过的坑 1.web基本框架:html+css+JavaScript,html为网页骨架,css为网页美化,JavaScript负责页面动态交互,脚本等 ...

  5. Java web 开发填坑记 2 -如何正确的创建一个Java Web 项目

    转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/72566261 本文出自[赵彦军的博客] Java web 开发填坑记 1-如何正确 ...

  6. 移动web开发填坑(一)

    上周开始接触移动web开发,默默的掉进了很多坑里面.本文主要总结本周遇到的坑以及如何填坑. 1.px与rem换算. 设计稿的宽度一般是640px,而iphone是320px,所以测量设计稿的结果首先要 ...

  7. Golang Web开发时前端出现谜之空白换行的坑

    在使用Golang做Web开发时,有时候渲染出来的模板在前台显示时会出现一些奇怪的空白换行,具体特征就是查看css样式表并没有相关定义的空白部分. 分析: 查看出现问题页面的网页源代码,复制空白换行部 ...

  8. Java Web 开发填坑记- 如何正确的下载 Eclipse

    一直以来,做 Java web 开发都是用 eclipse , 可是到 eclipse 官网一看,我的天 http://www.eclipse.org/downloads/eclipse-packag ...

  9. 【初码干货】使用阿里云对Web开发中的资源文件进行CDN加速的深入研究和实践

    提示:阅读本文需提前了解的相关知识 1.阿里云(https://www.aliyun.com) 2.阿里云CDN(https://www.aliyun.com/product/cdn) 3.阿里云OS ...

随机推荐

  1. Qt多线程学习:创建多线程

    [为什么要用多线程?] 传统的图形用户界面应用程序都仅仅有一个运行线程,而且一次仅仅运行一个操作.假设用户从用户界面中调用一个比較耗时的操作,当该操作正在运行时,用户界面一般会冻结而不再响应.这个问题 ...

  2. 关于ASP.NET中Button的OnClientClick属性

    Button有Click属性和OnClientClick属性,执行顺序上OnClientClick先执行,调用本地脚本,根据返回值确定是否执行Click. 当返回True则执行Click,当脚本错误或 ...

  3. Mac下配置cocos2d-x开发环境(android和ios)

    一.下载cocos2d-x http://cocos2d-x.org/projects/cocos2d-x/wiki/Download cocos2d-x-2.1.4.zip @ June.18, 2 ...

  4. TLS握手优化详解

      随着 HTTP/2 的逐渐普及,以及国内网络环境越来越糟糕(运营商劫持和篡改),HTTPS 已经开始成为主流.HTTPS 在 TCP 和 HTTP 之间增加了 TLS(Transport Laye ...

  5. H - Frequent values

    Problem F: Frequent values You are given a sequence of n integers a1 , a2 , ... , an in non-decreasi ...

  6. 【Mood-4】心静是一门艺术

    到现在工作还没有着落,心里面反而比以前平静,以前也知道自己的水平 属于一瓶不满,半瓶咣当的那种情况,但是那时候的自己总是觉得自己的综合水平可能会弥补一下自己在技术上的缺失,但是,现在看来,太过于自信, ...

  7. Androidstudio 点9图报错的问题

    在eclipse上.9图能够正常使用,但是到了Androidstudio上就报错无法引用,提示找不到.9图的问题.   解决方案: Androidstudio对.9图进行了更严格的定义, 1. 如果一 ...

  8. Django升级1.6之后出现“Bad Request (400)”错误的解决方案

    Django从1.4升级到1.6之后发现之前的网站都无法访问了,会出现“Bad Request (400)”的错误,搜了半天终于找到了解决办法. 解决方法很简单: 在settings.py里面添加: ...

  9. JS一定要放在Body的最底部么?

    一.从一个面试题说起 面试前端的时候我喜欢问一些看上去是常识的问题.比如:为什么大家普遍把 <script src=""></script> 这样的代码放在 ...

  10. 转: Android官方培训课程中文版(v0.9.5)

    转: https://segmentfault.com/a/1190000004279679 1. 胡凯 tx SNG的一个开发者. http://hukai.me/android-training- ...