本篇主要是我个人的学习分享。

1、弹出数字键盘

<!-- 有“#” “*” 符号输入 -->

<input type="tel">

<!-- 纯数字   -->

<input pattern=“\d”>

安卓、IOS的表现形式应该不太一样，大家可以动手试试。运用正则之后，就不用关注input 的类型了。

2、调出系统的某些功能

<!--  拨号 -->

<a href="tel:10086" >打电话给：10086 </a>

<!--发送邮件-->

<a href="mailto:839626987@qq.com">发邮件给：839626987@qq.com</a>

<!-- 发短信 -->

<a href=“sms:10086”>发短信给：</a>

<!-- 选择照片或者拍摄照片 -->

<input type="file" accept="video">

<!-- 多选 -->

<input type="file" multiple>

3、解决active伪类失效

<body ontouchstart><body>

给body注册一个空事件即可。

4、滑动不顺畅，粘手。

一般出现在IOS设备中，自定义盒子使用了 overflow：auto || scroll 后出现的情况。

div{

--webkit-overflow-scrolling:touch;

}

5、最简单的rem自适应

众所周知，rem的值是根据 根元素的字体大小相计算的，但是我们每个设备的大小不一样，所以 根元素的字体大小 要动态设置。

html{

font-size:cale(100vw / 3.75);

}

body{

font-size: .14rem;

}

还有更多知识点，由于能力有限，暂且分享到此刻，如果有大佬晓得跟多，请评论出来分享给我们大家。

整理几个经常在H5移动端开发遇到的东西。的更多相关文章

  1. H5移动端开发遇见的东西

    常见的有viewport.强制浏览器全屏.IOS的Web APP模式.可点击元素出现阴影 本文主要讲一些其他的或者实用的优化手段. 1. 弹出数字键盘 <!-- 有"#" & ...

  2. H5移动端开发入门知识以及CSS的单位汇总与用法

    说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid a ...

  3. H5移动端开发vue+vux

    项目src中用到的npm包有(从编译打包到最终部署仍不能移除)1:vue             渐进式 JavaScript 框架   http://cn.vuejs.org/v2/guide/2: ...

  4. H5 移动端开发中 ios/安卓坑 和经验总结

    1. ios new时间对象,需要用逗号隔开传日期的方式, 不支持 new Date('2019-03-01 08:00:00') 格式: 支持以下两种方式: 2. ios个别版本对fixed的属性的 ...

  5. h5 移动端开发自适应 meta name="viewport"的使用总结

    本文系个人理解,可能有误差,仅供参考,谨慎采纳! 布局视口: 系统自带 一般大于屏幕宽度 理想宽度:  设置页面的viewport 的一个宽度,使不同的手机的布局视口宽度尽量接近可视窗口的值: 可视视 ...

  6. 关于H5移动端开发 iPhone X适配

    一. 媒体查询. @media screen and (device-width:375px) and (device-height:812px){ #header { height: 88px; p ...

  7. H5移动端开发

    开发前准备 环境: Node.js LTS版本 git 最新版 文档: 本项目技术栈基于 ES2016 VueJS vux 快速开始 1.克隆项目 git clone https://gitee.co ...

  8. h5移动端常见虚拟键盘顶起底部导航栏解决办法

    在h5移动端开发中相信很多朋友跟我一样都会遇到页面底部导航被虚拟键盘顶起的问题,自己在网上找到的解决办法拿出来与大家分享,有不完美之处还望见谅,有更好的解决办法可以贴出来大家一起互相学习!! var ...

  9. H5移动端手势密码组件

    项目简介 最近参加了2017年360前端星计划,完成了一个有趣的UI组件开发大作业,借机和大家分享一下移动端开发的技术啦~~ 本项目采用原生JS和Canvas实现移动端手势密码组件,支持手势密码设置和 ...

随机推荐

  1. springboot + springcloud +nacos实战

    首先从整个软件的功能和应用场景来说,nacos更像consul,而非eureka,nacos设计的时候自带的配置中心功能,让我们省下了去搞springcloud config的时间,但这里并不是说na ...

  2. Hadoop生态体系组件

    目录: 一.本地数据集上传到数据仓库Hive 二.Hive的基本操作 三.Hive.Mysql.HBase数据互导 正文: 一.本地数据集上传到数据仓库Hive 1.实验数据集的下载 2.数据集的预处 ...

  3. JS---课程介绍 + JavaScript分三个部分

    Web API---课程介绍 DOM:     概念-----能够说出来--理解     作用----记住了----后来理解     回顾JS分几个部分---知道        DOM树---能够说出 ...

  4. CSS 学习手册

    目录 CSS 简介 1.CSS 简介 CSS 概述 层叠次序 2.CSS 基础语法 CSS 语法 值的不同写法和单位 记得写引号 多重声明: 空格和大小写 3.CSS 高级语法 选择器的分组 继承及其 ...

  5. android studio 3.4配置Android -jni 开发基础

    首先下载配置android studio ndk 1.打开sdkManager下载CMake和LLDB 2.配置ndk 项目新建 项目建立完毕后,工程目录如下,cpp文件夹是系统自动生成的 3.自定义 ...

  6. Oracle ASM无法识别扩展分区的磁盘设备

    在linux 环境下,我们一般通过udev或者asmlib来绑定磁盘分区作为ASM的候选存储单元.在使用udev的情况下,一般只要我们可以看到被绑定的磁盘的设备,并且这些设备的属主和权限没有问题,AS ...

  7. ORM映射（对象关系映射）

    ORM映射(对象关系映射)分创建表和操作表两个部分创建单表创建关联表(foreignKey) 一对一 一对多(重点) 多对多(重点) 创建表后加str方法把打印的地址转换成对应字符表的操作(增删改查) ...

  8. 生成对抗性网络GAN

    同VAE模型类似,GAN模型也包含了一对子模型.GAN的名字中包含一个对抗的概念,为了体现对抗这个概念,除了生成模型,其中还有另外一个模型帮助生成模型更好地学习观测数据的条件分布.这个模型可以称作判别 ...

  9. 10. 函数-lambda函数及高阶函数

    一.匿名函数解析 ​ 关键字lambda表示匿名函数,冒号前面的n表示函数参数,可以有多个参数.匿名函数有个限制,就是只能有一个表达式,不用写return,返回值就是该表达式的结果. ​ 用匿名函数有 ...

  10. C语言程序设计100例之（22）：插入排序

    例22  插入排序 问题描述 排序是计算机程序设计中的一种重要操作,它的功能是将一个数据元素或记录的任意序列,重新排列成一个以关键字递增(或递减)排列的有序序列. 排序的方法有很多,简单插入排序就是一 ...