通过PC端页面重构、PC端交互开发原生js+jquery、移动端页面开发+响应式布局和微信场景开发+公众号开发+游戏开发四个阶段由浅入深、循序渐进的系统学习过程,HTML5开发者可以独立开发出Html5类型的网站、App、web应用和游戏等。
在这里跟大家讲的是参加Html5培训需要的时间,但如果你选择自学,我想花费的时间会比较长。
现在以HBuilder工具编写为例:
1. 打开此工具,在项目管理器中右键单击创建一个web 项目
2.右键单击项目名称,新建一个HTML文件----form01.html
<!DOCTYPE html>
<!--
作者:offline
时间:2017-01-06
描述:form表单
在form标签中,有两个经常使用的属性
action:表单提交服务器地址
method: 表单提交的方法/方式----get/post
其他提交方式---put delete
提交方式----get(默认的提交方式)
1.请求的参数放到地址栏中
2.不安全
3.存在缓存
4.传输数据的大小收到限制
提交方式----post
1.请求的参数放到http协议中
2.相对安全---账号密码等信息不会放到地址栏中
3.没有缓存
4.传输数据的大小限制较小
修改成post之后,可能会出现错误信息。
input标签:定义输入字段,用户可在其中输入数据。
属性:
type 指示 input标签的类型,默认的是text
按钮类型: 普通按钮 button 重置按钮 Reset 提交按钮 submit
value 定义要显示的文本。
-->
<html>
<head>
<meta charset="utf-8">
<title>form表单1</title>
</head>
<body>
<form action="" method="post">
<input type="text" name="username" value="zhangsan" />
<input type="submit" value="提交" />
</form>
</body>
</html>
3.查看此网页是不是HTML5,主要看表头
4.HTML5新增了很多新内容,具体可以查看API,例如:在网页中嵌套音频/视频文件的格式
你看看这个效果,满足要求否?
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8">
<title>无标题文档</title>
<style>
.box{width:400pxheight:400pxmargin:50px autotransition:5s linear}
.box div{width:180pxheight:180pxmargin:10pxborder:1px solid #000box-sizing:border-boxfloat:leftbackground:url(new_bg.png) no-repeat}
.box div:nth-child(1),.box div:nth-child(4){ border-radius:0 70%}
.box div:nth-child(2),.box div:nth-child(3){ border-radius:70% 0}
.box:hover{ -webkit-transform:rotate(720deg)}
</style>
</head>
<body>
<div class="box">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)