学HTML5大概要花多久的时间

学HTML5大概要花多久的时间,第1张

参加HTML5开发培训的进度来看,对于一个没有编程基础和网页开发经验的人来讲,想要系统的掌握Html5开发技能至少需要学习4个月的时间

通过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>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6116631.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-15
下一篇 2023-03-15

发表评论

登录后才能评论

评论列表(0条)

保存