美文网首页
移动端页面开发之旅

移动端页面开发之旅

作者: scarqin | 来源:发表于2017-02-22 17:44 被阅读28次

    个人觉得做移动端网页三大难点

    • 自适应
    • 动画的效率
    • 移动端js事件的使用

    开始

    • 写移动端的第一步是在head标签里添加
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" charset="utf-8 " />
    上面声明,手机视口宽度=屏幕宽度,默认不可缩放
    
    
    • 开发环境
      可以使用http-server,browser-sync
      browser-sync 可以对文件进行监测,保存后自动刷新浏览器实现同步预览
      可以在手机和电脑同时访问
      前端开发工具-代理服务器
    • 调试环境
      谷歌浏览器 F12,推荐将调试框放在右边
    chrome调试

    动画的效率

    • opacity
    • translate
    • rotate
    • scale

    js事件的引用

    jquery包对于移动端有点太重
    移动端使用click时间有300s的延时,一般将click事件改为tap事件()

    想进步的话~多去看看大公司的布局和css用法

    资料

    查看各个手机数据
    基础方面
    一篇真正教会你开发移动端页面的文章--像素比
    移动web页面前端开发总结
    如何精确控制响应式排版
    性能方面
    网页性能管理详解
    前端性能优化(CSS动画篇)
    移动web开发问题和优化小结
    Web动画性能指南 Beta
    我的动画
    波纹星球招新页面
    移动web开发问题和优化小结]

    相关文章

      网友评论

          本文标题:移动端页面开发之旅

          本文链接:https://www.haomeiwen.com/subject/ownmlttx.html