移动开发准则

1.尽量使用单页面开发(SPA)

2.慎选UI框架

3.动画、特效使用(60fps)

**浏览器消耗最小的CSS属性**
位置:transform:translate(x,y,z)
大小:transform:scale(n)
旋转:transform:rotate(ndeg)
透明度:opacity:0~1

4.长度单位用rem

基本布局

流式布局

绝对定位布局



Flexbox布局(未来可能会成为主流)

CSS Grid layout(支持不完善)

HTML5开发和布局(待补充)的更多相关文章

  1. HTML5开发手机应用--viewport的作用

    在用HTML5开发手机应用或手机网页时,<head>部分总会有如下一段代码,这段代码到底什么意思呢.在网上,大家会得到很多答案.我从网上搜集了部分介绍,整理一下,以留备用. <met ...

  2. html5文章 -- HTML5开发实例-网易微博手机Web App开发过程

    HTML5在国内外越来越受到互联网开发团队的青睐.国外,谷歌兴致勃勃地开发Chrome Web Store,微软发布了支持使用HTML5技术开发的“Irish Spring”主题网站,诺基亚斥巨资购得 ...

  3. HTML5开发规范

    1.总体规范——采用html5的结构标签进行页面布局,注意结构的语义化,并注意页面大纲的层级结构.使用css3.0进行样式的设计. a.网页大纲查询网址http://gsnedders.html5.o ...

  4. [转]使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 事件详解

    在前文<使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 默认配置与事件基础>中,Kayo 对 jQuery Mobile 事件的基 ...

  5. 读书笔记:《HTML5开发手册》--figure、time、details、mark

    这是补充HTML5基础知识的系列内容,其他为: 一.HTML5-- 新的结构元素 二.HTML5-- figure.time.details.mark 三.HTML5-- details活学活用 四. ...

  6. HTML5开发手机应用--viewport的作用--20150216

    在用HTML5开发手机应用或手机网页时,<head>部分总会有如下一段代码,这段代码到底什么意思呢.在网上,大家会得到很多答案.我从网上搜集了部分介绍,整理一下,以留备用. <met ...

  7. HTML5 开发技能图谱skill-map

    # HTML5 开发技能图谱![HTML5 脑图](https://github.com/TeamStuQ/skill-map/blob/master/data/designbyStuQ/png-HT ...

  8. web前端学习(二)html学习笔记部分(10)-- HTML5构建应用布局和页面

    1.2.25  HTML5构建应用布局和页面 1.2.25.1  HTML5在移动开发中的准则 1.尽量使用单页面开发 2.慎重选择前端UI框架 3.动画.特效使用准则(60fps) 浏览器消耗最小的 ...

  9. 移动web开发之布局

    移动web开发流式布局 1.0 移动端基础 1.1浏览器现状 PC端常见浏览器:360浏览器.谷歌浏览器.火狐浏览器.QQ浏览器.百度浏览器.搜狗浏览器.IE浏览器. 移动端常见浏览器:UC浏览器,Q ...

随机推荐

  1. Linux Simple Systemd Service Guide

    Simple Systemd Service Guide 主题 Systemd介绍 Systemd基本操作 怎样编写_service_.service文件 怎样部署service Systemd介绍 ...

  2. hbuilder 打包 vueAPP

    1:设置状态栏颜色 在manifest.json 找到 plus 下添加 "statusbar": { "immersed": true/*沉浸式状态栏*/ 设 ...

  3. php 安装最新的redis连接扩展

    用于与redis连接的Php扩展[RC表示公测,我们用的是不带RC的稳定版本]下载包地址:http://pecl.php.net/package/redis 最新稳定版本:4.3.0 下载包:# wg ...

  4. ucos中的中断管理

    一.中断的概念 中断是一种硬件机制,用于处理异步事件.中断的实时性比轮询要好,通过中断,微控制器可以在异常发生的时候立刻进行处理,而不需要不断轮询事件是否发生. CM3支持中断嵌套,使得高优先级异常可 ...

  5. Vue父子组件生命过程

    加载渲染过程 父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount-& ...

  6. cacti 流量图合并

    cacti 安装:https://www.cnblogs.com/weijie0717/p/4072711.html 一.需求介绍 由于交换机的多端口跑同一种流量,需要汇总统计.因此需要见多个端口的流 ...

  7. 浅析MVC模式与三层架构的区别

    浅析MVC模式与三层架构的区别 三层架构和MVC是有明显区别的,MVC应该是表现模式(三个加起来以后才是三层架构中的UI层).三层架构(3-tier application) 通常意义上的三层架构就是 ...

  8. 实时ETL

    传统的ETL通常采用批处理的方式,一般来说是每天的夜间进行,当天的数据要到第二天才可以获得.随着数据仓库技术的逐步成熟,企业对数据仓库时间延迟的要求更高,希望达到零延迟,也就出现了实时ETL. 实时E ...

  9. 记录下本地修改php版本的过程, 本地PHP目录位置,PHP-FPM目录位置

    由于我在Cellar下安装了多个PHP版本,所以这里记录下如何修改本地的PHP版本 cd /usr/local/bin cp php71 php cp php71-fpm php-fpm vscode ...

  10. Eclipse oxygen 版本汉化教程

    Eclipse oxygen 版本汉化步骤如下: 第一步:打开Eclipse 第二步:浏览器打开网址 http://www.eclipse.org/babel/downloads.php 1.复制对应 ...