您的位置：首页 > Web前端 > HTML5

初学Html5的总结

2015-08-24 10:08 627 查看
最近看了一本HTML5+css3从入门到精髓，还没有看完，想要放弃看后面一些高级的用法部分，所以总结一下前面基础部分的东西。不然整本书就白看了。

一张图用来做对比



从图可看出HTML5相对于以前的版本简洁明了，现在用代码说明其简洁性

<!DOCTYPE HTML>

<META CHARSET="UTF-8"/>

<HTML>

  <HEAD>

    <TITLE></TITLE>

  </HEAD>

<BODY></BODY>

</HTML>

也可直接省略<head>和<title>部分。

2.新增的input类型

email类型的应用。

以往在输入email类型的时候都是要进行一大堆验证，现在新增了email类型之后可直接输入

<form action="demo_form.php" method="get">

请输入您的E-Mail地址：<input type="email"/>

</form>

与之相同的功能是url

number类型的应用（同理range）

他有四个属性max，min，step，value【step规定合法的数字间隔如step=2则合法的数字可为-2，0，2，4，6等】

日期检出器类型的应用

date

month

week

time

datetime

新增的autocomplete属性

<form
autocomplete="on">

please enter your favorite city:<input
type="text"
id="city"list="cityList">

<datalist
id="cityList"
style="display:none">

<option
value="beijing">beijing</option>

<option
value="shanghai">shanghai</option>

<option
value="songzi">songzi</option>

<option
value="changsha">changsha</option>

<option
value="huaihua">huaihua</option>

</datalist>

</form>

则可以得到点击文本框就会出现datalist数据

新增的placeholder属性

placeholder属性用于为input类型的输入框提供的一种属性。即当显示页面时会将想要显示的字段显示出来，而当输入框获得焦点时会消失。

画布canvas

用图解释一下canvas的坐标



fillRect()和fillStyle()是绘制用颜色填充的区域

strokeStyle()和strokeRect()是绘制轮廓和线条

头晕，canvas下次再详说。


内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航