HTML5状态标签和进度标签

<meter>状态标签(实时状态显示:气压,气温)

<progress> 进度标签(任务过程:安装,加载)

<meter value="80" min="0" max="100" low="30" high="70"></meter>

value表示当前值

min表示最小值

max表示最大值

low表示最小警戒值

high表示最大警戒值

低于low或者大于high的值,都会显示黄色。

<progress max="100" value="0" id="pro"></progress>

max   最大值

value 当前值

javascript脚本模拟进度条

<script type="text/javascript">

var pro = document.getElementById("pro");

setInterval(function(){

pro.value +=1;

},100);

</script>

时间: 2024-07-29 09:05:25

HTML5状态标签和进度标签的相关文章

html5 input标签、details标签、mark标签以及进度条标签的使用

最近在自学html5的相关知识,平生第一次写博客,这次主要记录input标签与datalist标签的结合.details标签.mark标签以及进度条标签的使用. 一.input标签和detail标签的配合使用 1.基本语法 <input type="text" list="vallist"/> <datalist id="vallist"> <option value="c++">c++&l

自学HTML5第二节(标签篇---新增标签详解)

HTML5新增标签: <article> 标签 规定独立的自包含内容.一篇文章应有其自身的意义,应该有可能独立于站点的其余部分对其进行分发. <article> 元素的潜在来源: 论坛帖子 报纸文章 博客条目 用户评论 实例: <article> <h1>Internet Explorer 9</h1> <p>Windows Internet Explorer 9(简称 IE9)于 2011 年 3 月 14 日发布.....<

HTML5中新加的标签和属性定义

HTML5 <!DOCTYPE> 标签所有主流浏览器都支持 <!DOCTYPE> 声明.<!DOCTYPE> 声明非常重要,它是一种标准通用标记语言的文档类型声明,通过该标签,浏览器能够了解HTML5文档正在使用的HTML规范,<!DOCTYPE> 声明是HTML5文档的起始点,也就是说它必须位于HTML5文档的第一行!标签定义及使用说明:<!DOCTYPE> 声明位于文档中的最前面的位置,处于 <html> 标签之前.<!DO

HTML5进阶段内联标签汇总(小篇)

HTML5进阶段内联标签汇总(小篇) 内联元素,与别人公用一行,但是设置宽高无效.其特点: ①和其他元素都在一行上: ②高,行高及外边距和内边距不可改变: ③宽度就是它的文字或图片的宽度,不可改变 ④内联元素只能容纳文本或者其他内联元素 代码如下: 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>

html5的行标签与列标签

html5的标签很多,这里不一一列举.下面只将常用的一些html5的行标签和列标签进行了分类总结,方便大家学习借鉴.注意:一些标签可在css样式中进行行标签与列标签的互相转换,这里所列举的标签没有进行任何样式的设置,所有列标签和行标签经本人亲测有效.块标签: <h1>一级标题 <h2>二级标题 <h3>三级标题 <h4>四级标题 <h5>五级标题 <h6>六级标题 <ul>无序列表 <ol>有序列表 <d

Html5学习笔记1 元素 标签 属性

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML5学习笔记</title> </head> <body bgcolor="#90ee90"> 1.Html5的元素<br/><br/> 元素指的是从開始标签到结束标签的全部代码<

HTML5标签与HTML4标签的区别示例介绍_html5教程技巧

(1)概念的变化: HTML5专注内容与结构,而不专注的表现 <header> <hgroup>导航相关数据</hgroup> </header> <nav>菜单</nav> <article> <h1>标题:HTML5专题视频教程</h1> (2)声明与标签: HTML5在更多的声明和标签上面做了简化,也对兼容做了详细的规定,废除了部分元素,增加了部分元素. HTML5标签语法介绍及新增标记 1.

直接在低版本IE6/7/8浏览器中使用HTML5的audio和video标签播放视频音频的办法

摘自:http://www.uiej.com/1107.html 通常人们习惯用swf播放器来播放网络视频音频 HTML5给我们带来了很多惊喜,其中新增加的audio和video标签可以让我们更方便的在网页中播放音频和视频.video标签虽好,然而目前它却无法在旧版的IE浏览器中使用.所以一般还是用flash播放器来播放视频,例如优酷网站的插入视频的代码如下: <embed src="http://player.youku.com/player.php/sid/XNjgwMDU5MDU2/

html5新增的语义化标签

1.什么是语义化标签? 那么什么叫做语义化呢,说的通俗点就是:明白每个标签的用途(在什么情况下我可以使用这个标签才合理)比如, 网页上的文章的标题就可以用标题标签,网页上的各个栏目的栏目名称也可以使用标题标签. 文章中内容的段落就得放在段落标签中,在文章中有想强调的文本,就可以使用em标签表示强调等等. 2.为啥使用语义化标签? 1. 更容易被搜索引擎收录. 2. 更容易让屏幕阅读器读出网页内容. 3. 能够更好的体现页面的主题 4.兼容性更好,支持更多的网络设备 3.html语义化标签 1):