移动开发准则

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. Java内存的 静态方法和实例方法的区别及使用场景

    注意:变量指基本数据类型非对象,局部变量不能被静态修饰 1.(静态)成员变量存放在data segment区(数据区),字符串常量也存放在该区 2.非静态变量,new出来的对象存放在堆内存,所有局部变 ...

  2. Eclipse安装TestNG插件

    TestNG按照其文档的定义是: TestNG是一个测试框架,其灵感来自JUnit和NUnit的,但引入了一些新的功能,使其功能更强大,使用更方便. TestNG是一个开源自动化测试框架;TestNG ...

  3. Ubuntu 通过apt安装VSCode

    1. sudo vim /etc/apt/sources.list.d/vscode.list 并向里面添加:deb [arch=amd64] http://packages.microsoft.co ...

  4. PCIE4.0 简单介绍

    关于PCI-E的标准,可以从2003年说起,2003年推出了PCI-E 1.0标准,在三年之后就推出了PCI-E 2.0,而在4年后的2010年就推出了PCI-E 3.0,但是在2010年之后的6年里 ...

  5. Spark2.0学习(三)--------核心API

    Spark核心API----------------- [SparkContext] 连接到spark集群,入口点. [HadoopRDD] 读取hadoop上的数据, [MapPartitionsR ...

  6. centos 7 上Hive-2.1.1的安装与基本操作

    首先安装mysql 1.       在线安装mysql a)        yum install mysql b)        yum install mysql-devel c)        ...

  7. Layer 创建 和 lamdba function 创建 和 API GateWay 配置 和 添加依赖

    进入控制台 选择 Lamdba 服务 进入控制面板, 单击右边: 创建函数 然后进入此图界面 添加lamdba 函数 名称 选择运行环境:python 选择角色 选择现有角色, 角色创建 可以参考 无 ...

  8. CentOS7 常用设置

    安装配置 0.Centos7 优盘U盘安装以及解决安装时引导错误 1.CentOS7开启网卡,设置开机启用网卡 2.CentOS7 修改静态IP地址 3.CentOS7 下使用root免密码输入自动登 ...

  9. optional install error: Package require os(darwin) not compatible with your platform(win32)

    解决方法: cnpm rebuild node-sass cnpm install

  10. VS 2017显示“高级保存选项”命令操作方法

    Visual Studio提供“高级保存选项”功能,它能指定特定代码文件的编码规范和行尾所使用的换行符.在Visual Studio 2017中,该命令默认是没有显示在“文件”菜单中的.用户需要手工设 ...