温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

初识Html5

发布时间:2020-06-21 00:54:38 来源:网络 阅读:394 作者:蓬莱仙羽 栏目:移动开发

u html5的介绍和快速入门

html5 大致是 (html+css3+javascript apis)

一句话: html5 支持了css3 的强大的选择器和动画等功能+ 支持javascript 很多新的函数,所以html5就很强大了.

 

1.       增加了<canvas> 标签,这个标签就是画布,程序员可以再这里绘制图形,所以这个标签在一定程度上可以替代flash, 在canvas 上画出矩形

代码: html5-1.html<!-- 告诉浏览器这个一个html5的网页-->

<!DOCTYPEhtml>

<html>

<head>

<!--网页的编码-->

<metacharset="utf-8"/>

</head>

<body>

<!--这是一个画布标签,我们这个这个区域绘制图形.-->

<canvasid="can1" width="500px" height="400px"style="border: 1px solid red">

</canvas>

 

 

<scripttype="text/javascript">

      

       //我要在画布画出矩形.

       //1. 得到画布

       varcanvas=document.getElementById("can1");

       //2. 得到上下文环境.,我们可以通过cxt这个对象来绘制图形

       //你也可以简单的理解,这个cxt就是画笔,cxt提供了很多绘制图形的方法

       //通过这些方法就可以绘制图形

       varcxt=canvas.getContext("2d");

       //我们看看cxt是什么类型

       //alert(cxt);

 

       //画出一个矩形,默认是黑色

       //改变颜色-红色

       cxt.fillStyle="#FF0000";

       cxt.fillRect(10,10,30,30);

</script>

</body>

</html>

 

2.       增加了<header> <footer> 标签,做到内容和结构分离,利用seo

大家知道,我们很多网页都有头和尾

<html>

<header>网页的头部<header>

hello,world..

<footer>网页的尾部</footer>

 

3.       增加<video> 和<audio>标签,我们视频和音频嵌入变得非常容易.

<!-- 告诉浏览器这个一个html5的网页-->

<!DOCTYPEhtml>

<html>

<head>

<!--网页的编码-->

<metacharset="utf-8"/>

</head>

<body>

<!--嵌入一段视频-->

<videosrc="[HTML5教程].(HTML5.Tutorial).-.1.-.Introduction.mp4"controls="controls" width="300px"height="200px"></video>

</body>

</html>

 

 

向AI问一下细节
推荐阅读:
  1. 初识UNIX
  2. puppet 初识

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI