/* 移动端定义字体的代码 */
body {
  font-family: "Helvetica Neue", Helvetica;
}

ios端触摸时,会出现一个半透明灰色遮罩
  如果想要禁用,可设置-webkit-tap-highlight-color的alpha值为0

body{-webkit-tap-highlight-color: rgba(0,0,0,0);}

关于 iOS 与 OS X 端字体的优化(横竖屏会出现字体加粗不一致等)
  iOS 浏览器横屏时会重置字体大小

body{
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

禁止 iOS 弹出各种操作窗口
-webkit-touch-callout:none;

禁止用户选中文字
-webkit-user-select:none;

上下拉动滚动条时卡顿、慢

div {
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}

IOS设备输入框默认内阴影
input {
  -webkit-appearance: none;
}

// 阻止页面滑动的默认行为
document.body.addEventListener('touchmove', function(event) {
  if (event.cancelable) {
  // 判断默认行为是否已经被禁用
    (!event.defaultPrevented) && event.preventDefault();
  }
});

移动端web开发整理的更多相关文章

  1. 移动端 Web 开发前端知识整理

    文章来源: http://www.restran.net/2015/05/14/mobile-web-front-end-collections/ 最近整理的移动端 Web 开发前端知识,不定期更新. ...

  2. 移动端web开发的一些知识点

    整理一下自己平时移动端web开发中遇到的问题,也参考一下前辈的一些总结 1.最常见的要数1像素边框了 因为Retine屏的分辨率始终是普通屏幕的2倍,1px的边框在dpr=2的retina屏下会显示成 ...

  3. 【前端】移动端Web开发学习笔记【2】 & flex布局

    上一篇:移动端Web开发学习笔记[1] meta标签 width设置的是layout viewport 的宽度 initial-scale=1.0 自带 width=device-width 最佳实践 ...

  4. 【前端】移动端Web开发学习笔记【1】

    下一篇:移动端Web开发学习笔记[2] Part 1: 两篇重要的博客 有两篇翻译过来的博客值得一看: 两个viewport的故事(第一部分) 两个viewport的故事(第二部分) 这两篇博客探讨了 ...

  5. 移动端web开发基础概念

    最近在了解移动端web开发的相关知识,有些概念总是模糊不清,这次花费了一些时间整体的梳理了一遍. 分辨率 分辨率可以从显示分辨率与图像分辨率两个方向来分类.显示分辨率(屏幕分辨率)是屏幕图像的精密度, ...

  6. 移动端Web开发注意点

    不用考虑浏览器兼容性 移动端开发主要对象是手持设备,其中绝大部分是IOS和Android系统,so,在开发此类页面时不必纠结IE和其他一些2B浏览器的兼容性,webkit是本次开发重点. 当然,不同版 ...

  7. 移动端Web开发如何处理横竖屏

    <!Doctype html> <html> <head> <meta charset="utf-8"> <meta id=& ...

  8. 移动端web开发技巧(转)

    原文链接:http://liujinkai.com/2015/06/06/mobile-web-skill/ 移动端web开发技巧 这是一个最好的时代,因为我们站在潮流中:但也是一个最坏的时代,因为我 ...

  9. 安卓手机移动端Web开发调试之Chrome远程调试(Remote Debugging)

    一.让安卓打debug模式的apk包 二.将电脑中的chrome升级到最新版本,在chrome浏览器地址栏中输入chrome://inspect/#devices: 在智能手机还未普及时,移动设备的调 ...

随机推荐

  1. WebService快速上手

    一.WebService是什么? 核心特征:跨语言.跨平台.远程调用[如果是本地系统交互,使用rpc或者com技术就行] soap:HTTP + XML [基于Http的xml格式数据交互] wsdl ...

  2. C++中前置声明介绍

    前置声明是指对类.函数.模板或者结构体进行声明,仅仅是声明,不包含相关具体的定义.在很多场合我们可以用前置声明来代替#include语句. 类的前置声明只是告诉编译器这是一个类型,但无法告知类型的大小 ...

  3. Kubernetes学习之路(二十三)之资源指标和集群监控

    目录 1.资源指标和资源监控 2.Weave Scope监控集群 (1)Weave Scope部署 (2)使用 Scope (3)拓扑结构 (4)实时资源监控 (5)在线操作 (6)强大的搜索功能 2 ...

  4. 解决Git在添加ignore文件之前就提交了项目无法再过滤问题

    由于未添加ignore文件造成提交的项目很大(包含生成的二进制文件).所以我们可以将编译生成的文件进行过滤,避免添加到版本库中了. 首先为避免冲突需要先同步下远程仓库 $ git pull 在本地项目 ...

  5. [LOJ#6039].「雅礼集训 2017 Day5」珠宝[决策单调性]

    题意 题目链接 分析 注意到本题的 \(C\) 很小,考虑定义一个和 \(C\) 有关的状态. 记 \(f(x,j)\) 表示考虑到了价格为 \(x\) 的物品,一共花费了 \(j\) 元的最大收益. ...

  6. [CF1063F]String Journey[后缀数组+线段树]

    题意 在 \(S\) 中找出 \(t\) 个子串满足 \(t_{i+1}\) 是 \(t_{i}\) 的子串,要让 \(t\) 最大. \(|S| \leq 5\times 10^5\). 分析 定义 ...

  7. In-Memory:内存优化表的DMV

    SQL Server 在执行查询时,自动将活动的相关信息保存在内存中,这些活动信息称作DMV(Dynamic Management View),DMV记录SQL Server实例级别上的活动信息.由于 ...

  8. VirtualBox虚拟机怎么导入已经存在的vdi文件

    VirtualBox虚拟机怎么导入已经存在的vdi文件 第一章 1.原因 早上一不小心将virtualBox 卸载了,(不知道怎么了, 里面得虚拟机全部都没有了,但是vdi文件还在) 2.解决办法 直 ...

  9. FFMPEG的基础使用

    由于最近要将yuv视频下采样,于是使用ffmpeg快速将yuv视频下降分辨率.在此记录ffmpeg的基础使用方法和所遇到的问题: 下载,可到官网下载:https://www.ffmpeg.org/ . ...

  10. Delphi中 弹出框的用法

    Delphi中的提示框有 Application.MessageBox  ShowMessage messagedlg 个人认为 相对来说 Application.MessageBox 更加灵活 也相 ...