标题:其他类型的标签
只看楼主
elsyyzh
Rank: 1
来 自:湖北黄冈
等 级:新手上路
帖 子:29
专家分:0
注 册:2015-11-9
结帖率:0
 问题点数:0 回复次数:0 
其他类型的标签
1.figure和figcaption标签

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

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

<figure>                              
     <img src="images/1.jpg">                           
     <figcation>壁纸</figcation>                        
</figure>
2.datails和sunmary标签

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

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

<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属性值。


<meter min="0" max="100" value="30" low="50" high="80" optimum="100"></meter>
4.mark标签、cite标签、small标签和time标签

mark突出显示部分文字
<p>在元素中表现出来的<mark>实际数量值</mark>,该属性缺省值为0,可以给该属性指定浮点数小数值。</p>
cite标签通常表示它所包含的文本对某个参考文献的引用,比如书籍或者杂志的标题。


<p>在元素中表现出来的<cite>实际数量值</cite>,该属性缺省值为0,可以给该属性指定浮点数小数值。</p>
small和big标签缩小和放大一个字号,从理论上说,它们是纯碎性的表示性元素,使用它们已取得“按照重要性加权”的视觉效果。

5.time标签

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

<p>记得<time datetime="2015-11-11">光棍节要上天猫哦</p>
6.canvas标签

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

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

<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元素来显示一个红色的矩形
搜索更多相关主题的帖子: details images figure 标签 照片 
2015-11-13 14:50



参与讨论请移步原网站贴子:https://bbs.bccn.net/thread-459159-1-1.html




关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.011590 second(s), 7 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved