类似的题目一搜一大堆,我就不再写那些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. 在android market发布个人免费应用的步骤

    写了一段时间的android应用了,只是在自己手机上面安装. 上周申请了android developer,需要一次性25美元的程序开发注册费用.费用需要用google checkout,所以还要先申 ...

  2. 制作简易计算器处理结果Servlet

    ResultServlet.java: package com.you.servlet; import java.io.IOException; import java.io.PrintWriter; ...

  3. java 验证码图片处理类,为验证码识别做准备

    /* * To change this template, choose Tools | Templates * and open the template in the editor. */pack ...

  4. iOS开发——UI高级OC篇&自定义控件之调整按钮中子控件(图片和文字)的位置

    自定义控件之调整按钮中子控件(图片和文字)的位置 其实还有一种是在storyBoard中实现的,只需要设置对应空间的左右间距: 这里实现前面两种自定义的方式 一:imageRectForContent ...

  5. python 中sys.stdout.write 和 print >> sys.stdout的区别(转)

    下面应该可以解你的惑了: print >> sys.stdout的形式就是print的一种默认输出格式,等于print "%VALUE%" 看下面的代码的英文注释,是p ...

  6. mysql开启慢查询方法(转)

    1,配置开启 Linux: 在mysql配置文件my.cnf中增加 log-slow-queries=/var/lib/mysql/slowquery.log (指定日志文件存放位置,可以为空,系统会 ...

  7. 好记心不如烂笔头之JQuery学习,第二章

    jQuery获取元素不需要担心元素不存在而报错,但是无论怎样 $("#xxx") 是一定会有返回值的,无论存不存在元素,那么依然是要对元素做判断的,判断的方法常见两种 1.看返回的 ...

  8. 标准库 - fmt/scan.go 解读

    // Copyright 2010 The Go Authors. All rights reserved. // Use of this source code is governed by a B ...

  9. Excel处理数据用到的一些公式和VBA脚本

    最近工作中用到EXCEL统计处理一些数据,正好之前有自学了一段时间的EXCEL,这次正好用上.为了加深印象,以后方便翻阅,就记录下来.这篇会不断补充. IF 多条件判断返回值 IF(logical_t ...

  10. iOS 切图使用 分辨率 使用 相关总结

    疑问: 就iphone来说分辨率有三种,320*480. 640*960. 640*1136 那么如果我想做图,如果是320*480 1.是不是所有的图片,比如按钮的,背景图的,尺寸都必须做成小于或等 ...