初学Html5的总结

最近看了一本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下次再详说。


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值