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
大家知道,我們很多網頁都有頭和尾
<header>網頁的頭部<header>
hello,world..
<footer>網頁的尾部</footer>
3. 增加<video> 和<audio>标簽,我們視訊和音頻嵌入變得非常容易.
<!-- 告訴浏覽器這個一個html5的網頁-->
<!--嵌入一段視訊-->
<videosrc="[HTML5教程].(HTML5.Tutorial).-.1.-.Introduction.mp4"controls="controls" width="300px"height="200px"></video>
本文轉自蓬萊仙羽51CTO部落格,原文連結:http://blog.51cto.com/dingxiaowei/1366605,如需轉載請自行聯系原作者