其他类型的标签

1.figure和figcaption标签

figure标签规定独立的流内容（图像、图表、照片、代码等等）figure元素的内容应该与主内容相关，但如果被删除，则不应对文档产生影响。

figcaption定义figure元素的标题（caption）“figcaption”元素应该被置于“figure”元素的第一个或者最后一个元素的位置。

?

1 2 3 4

< figure >                                      < img  src = "images/1.jpg" >                                   < figcation >壁纸</ figcation >                          </ figure >

2.datails和sunmary标签

details标签用于描述文档某部分的细节

summary标签作为details的标题，标题是可见的，用户点击标题时，会显示出datails的详细内容，默认打开的。

?

1 2 3 4

< details >         < summary >html5</ summary >         < p >内容</ p > </ details >

3.progress和meter标签

progress属性用于描述一个进度条，value表示进度的当前值，max表示总进度。

meter它的结构类似于progress控件，都是设置一个max参数，使用value来显示指定的结果，但它比progress多了几个参数，还可以设置min表示最低值，还可以设置high、low、optimum，这些参数用来描述数据的状态。

meter属性：

value       在元素中表现出来的实际数量值，该属性缺省值为0，可以给该属性指定浮点数小数值。

min          指定规定的范围时允许使用的最小值，该属性缺省值为0，设置最小值时，值不可小于0.

max         指定规定的范围时允许使用的最大值，如果设定该属性值小于min时，那么浏览器会把min设为最大值，max属性                   缺省值为1

low          规定范围的下限值，必须小于或等于max属性值，同样的，如果low值小于min值时，那么浏览器会把min属性值设                 为low属性值。

high         规定范围的上限值，如果该属性值小于low属性值，那么把low属性值视为high属性值，同样的，如果high属性值                   大于max属性值时，浏览器会把max属性值设为high属性值。

optimum  设置最佳值，属性必须在min属性和max属性之间，可以大于high属性值。

?

1	< meter  min = "0"  max = "100"  value = "30"  low = "50"  high = "80"  optimum = "100" ></ meter >

4.mark标签、cite标签、small标签和time标签

mark突出显示部分文字

?

1	< p >在元素中表现出来的< mark >实际数量值</ mark >，该属性缺省值为0，可以给该属性指定浮点数小数值。</ p >

cite标签通常表示它所包含的文本对某个参考文献的引用，比如书籍或者杂志的标题。

?

1	< p >在元素中表现出来的< cite >实际数量值</ cite >，该属性缺省值为0，可以给该属性指定浮点数小数值。</ p >

small和big标签缩小和放大一个字号，从理论上说，它们是纯碎性的表示性元素，使用它们已取得“按照重要性加权”的视觉效果。

5.time标签

定义时间或者日期，或者两者

?

1	< p >记得< time  datetime = "2015-11-11" >光棍节要上天猫哦</ p >

6.canvas标签

定义图形，绘制路径，矩形，圆形，字符以及添加图像方法

canvas元素本身没有绘图能力，所以绘制工作必须在javascript内部完成

?

1 2 3 4 5 6 7

< canvas  id = "myCanvas" ></ canvas > < script  type = "text/javascript" >          var canvas=ducument.getElementById('myCanvas');          car ctx=canvas.getContext('2d');          cxt.fillStyle='#FF0000';          cxt.fillRect(0,0,80,100); </ script >

通过canvas元素来显示一个红色的矩形