为什么用H5
1> 跨平台
利用HTML5编写的UI界面能运行在所有拥有浏览器的平台
2> HTML5的运行平台：浏览器
3> 但是HTML5不能完成一些特定的功能，比如：拍照(ImagePickerController)、访问相册....
如何使用HTML5
1> 自己编写大量的HTML5代码
2> 使用现成的HTML5框架
sencha-touch
phoneGap
jQuery mobile
Bootstrap
手机APP的开发模式
1> 原生（纯OC）
2> 纯HTML5
3> 原生+HTML5
4> React Native
开发工具
1> Android
eclipse、MyEclipse、android studio
2> iOS
Xcode
3> HTML5
eclipse、MyEclipse
后端喜爱
Dreamwaver
网⻚三剑客 Dreamwaver、Flash、Fireworks -> Adobe
WebStrom
前端喜爱,⼤神编辑器,默认集成各种各样的插件,配⾊完美
一个有具体功能的完整的网页，一般由3部分组成
HTML
网页的具体内容和结构
CSS
网页的样式（美化网页最重要的一块）
JavaScript(掌握)
网页的交互效果，比如对用户鼠标事件做出响应
常见的HTML标签
标题：h1、h2、h3、h4、h5、h6
段落：p
换行：br、 hr(分割线)
容器：div(独占一行)、span（根据内容调整宽度）（用来容纳其他标签）
表格：table、tr、td
列表：ul、ol、li
图片：img
表单：input
链接：a
<header>里面包含css和js代码
<meta charset="utf-8"> header中设置编码，防止title乱码 这个只设置一次! utf-8支持所有国家的语言
<body>包含html代码
<input placeholder="我是占位文字"> 没有闭合标签的都是单标签
<!--图像标签-->
<!--
src 资源路径 alt:占位文字
相对路径: XX/ XXX/ X/X/
绝对路径: http:// file:///
-->
<!--关于图片尺寸的设置,如果设置一个宽度,高度不设置默认帮你设置成为 auto 自动缩放-->
<img src="img/img_01.jpg" alt="这是一张图片" width="150" >
<!-- 百分比是相对于父标签!!! -->
<img src="img/img_02.jpg" width="50%">
<!--超链接标签 target : 打开网页的方式-->
<!--
_blank : 空白窗口
_self: 当前窗口跳转(压栈的操作)
_top : 点击我就回到顶部
_parent: 父标签,父窗口
-->
<a target="_top" href="#">我是超链接</a>
<!-- 相当于push 压栈的操作!! 默认target属性是:self -->
<a
<!--# 就是当前页面-->
<a href="#">我也是超链接</a>
？理解一下target
_blank : 空白窗口
_self: 当前窗口跳转(压栈的操作)默认
_top : 点击我就回到顶部（href="#"时起作用，否则跟_self一样的效果）
_parent: 父标签,父窗口 （自己测跟_self一样的效果）
src 引入资源，对标签是必须的，没有标签都不显示
href 引用，不必须
<div>相当于我们的view