随笔 - 54,  文章 - 0,  评论 - 0,  阅读 - 13074

HTML5是一些独立特性的集合,其中不仅添加了许多web页面特性,而且其本身也是一个应用程序。

details元素和summary元素

details元素用于描述文档或文档某个部分的细节。

summary元素经常与details元素配合使用作为details元素的第一个子元素,用于details定义标题。

标题是可见的,当用户单击标题时,会显示或隐藏details中的其他内容。

下面通过一个案例对details元素和summary元素的用法进行演示:

 

 

 

运行效果如图所示:

 

 

 

progress元素

progress元素用于表示一个任务完成的进度。这个进度可以是不确定的,只是表示进度正在进行,但是不清楚还有多少工作量没有完成;

也可以用0到某个最大数字之间的数字来表示准确的进度完成情况。

progress元素的常用属性值有以下2个:

  • value:已经完成的工作量
  • max:总共有多少工作量

需要注意的是,value和max属性的值必须大于0,且value的值要小于或等于max的值。

下面通过一个案例对progress元素的用法进行演示:

 

运行效果如图所示:

 

 

 meter元素

meter元素用于表示指定范围内的数值。

meter元素的常用属性:

属性

说明

high

定义度量的值位于哪个值之上会被界定为高

low

定义度量的值位于哪个值之下会被界定为低

max

定义最大值,默认值为1

min

定义最小值,默认值为0

optimum

定义什么样的值为最佳值。如果该值高于high属性的值,意味着值越高越好;如果该值低于low属性的值,这意味着越低越好

value

定义度量的值

下面通过一个案例对meter元素的用法进行演示:

 

 

运行效果如图所示:

 

posted on   心有所信方能行远  阅读(206)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
点击右上角即可分享
微信分享提示