博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
移动端知识梳理
阅读量:7072 次
发布时间:2019-06-28

本文共 1483 字,大约阅读时间需要 4 分钟。

  • 插件:

    • swiper
    • iscroll
    • ejs(主要应用于node.js)
    • zepto(同jq用法一样,更适合于移动端)
    • less
  • H5:

    • 新增标签
      • header
      • footer
      • section
      • time
      • main
      • nav
      • ...
    • 对于input新增表单元素属性,以及新增类型的优势
      • email
      • tel
      • url
      • search
      • date
      • time
      • number
      • color
      • week
      • month
      • range(音量)
    • ->在移动端表单元素中没有keydown/keyup事件(移动端的见怕是虚拟键盘),这两个事件(输入内容事件)统一使用input事件代替:[ELEMENT].οninput=function(){}
    • ->placeholder:在IE(10以下,10兼容,但是不是很好,可以理解为不兼容)下不兼容,如何使用JS来模拟。
  • audio/video:移动端音频/视频(公认为本次升级最伟大之处)

    • ->在真实项目中应用audio都是做背景音乐播放(专门做音乐播放器的很少,基本上就是做音乐的公司):src、preload、autoplay、loop、controls、play()、pause()、paused...
    • ->真实项目中的video不是直接使用最简单的内置播放器(用到的属性和方法和audio差不多),就是直接使用别人封装好的播放器插件:tvplayer、腾讯视频插件...
  • 新增加的一些JS的API

    • ->本地存储:webStorage(localStorage/sessionStorage)
    • ->离线缓存(不是很稳定):xxx.manifest(手机断网情况下依然可以观看网页中的内容,就是应用离线缓存技术事先把内容存储到本地)
    • ->webSocket/socket.io
    • ->获取地理位置的方法:真实项目中获取到经纬度、精准度后,会把这些信息发送给第三方地图接口,从而获取到我们需要的一些信息
  • CSS3

    • 选择器
    • 倒入字体图标
    • 常用属性:border-radius/box-shadow/text-shadow...
    • 背景变革:background-image/-color/-position(雪碧图、图片精灵、)CSS-Sprite/-attachment
    • background-size/-clip/-origin
    • 背景颜色的线性和放射性渐变
    • filter的高级应用:反色、灰度
    • 盒子模型:
      • box-sizing:border-box/content-box(默认)
      • columns:多列布局
      • flex:弹性伸缩盒子模型
      • 变形:transform
      • 动画:transition animation
  • 响应式布局: + ->PC和移动端用一套的使用(外层盒子宽度百分比,其余都是写死的,拿@media(国际通用规范)在不同设备中一点点的调整样式) + ->REM(懒人做法),一般应用于当卡项目仅仅是在移动端设备上访问的(在PC端部兼容) + ->flex不是响应式布局方案,仅仅是某些特殊的效果用这个来做而已

  • webApp/Hybrid模式: 把我们做的H5页面运行在浏览器中或者其他App的webView中就是基于Hybrid混合模式开发的webApp项目 微信二次开发仅仅是在我们写好的H5页面基础上调取微信提供的接口(调取接口的时候需要配合后台使用): 

  • 兼容:

    • 兼容ios和安卓
      • -webkit-transfrom:
      • transfrom:

转载于:https://www.cnblogs.com/Scar007/p/7640638.html

你可能感兴趣的文章
rabbitMQ集群的搭建和维护第二篇---利用python程序完成mq的消息收发和实时监控
查看>>
网众设置开机重启服务的命令,才可连接BOOT服务器
查看>>
数字签名基本原理
查看>>
RHEL6.3 DNS配置详解一 DNS相关概念理解及配置基础
查看>>
Windows环境 和 Linux环境下搭建Qt开发环境
查看>>
简述synchronized和java.util.concurrent.locks.Lock的异同
查看>>
辅DNS服务器部署文档(for linux平台)
查看>>
weblogic安装问题
查看>>
在win2008r2下开启ntp服务
查看>>
我的友情链接
查看>>
SpringMVC源码解析(三)——HandlerAdapter
查看>>
Python执行系统命令的方法
查看>>
动态加载远程Jar的实现方式
查看>>
无线***笔记(一)-《***WPA-PSK加密无线网络》
查看>>
MyEclipse10.1集成SVN
查看>>
Sitemesh和Struts2结合时Filter的配制顺序
查看>>
【python】编程语言入门经典100例--19
查看>>
[tomcat7源码学习]ClassLoader加载Tomcat的依赖
查看>>
解决MySQL Master/Slave 同步出错
查看>>
常用的主机监控Shell脚本
查看>>