HTML5中进度条进度元素的简要介绍与兼容性

1。对进度元素的基本理解
1。基本的UI
进步元素属于HTML5的家庭，指的是进度条。IE10 +和其他可靠的浏览器都支持。下面简单的代码：

xml代码将内容复制到剪贴板。
（o）

这是一个很好的进度条。有些人想知道：唉，我怎么看一个人物表情捏EN hellip；我只能对你说：你鄙视你，你不能使用Web浏览器！
默认效果不同于不同的浏览器，如截图所示（窗口7）：
IE10粒子速度的分离效果，或非常明亮的斑点。

2。基本属性
马克斯的价值、地位和标签。
（1）max是指最大值。如果默认值，进度值范围从0到1，如果设置为max＝100，则进度值范围从0到100。
（2）值是一个值，如果max＝100，值= 50只是速度的一半。值属性的存在与否决定了进度条是否确定。例如，没有价值的，是不确定的，所以IE10浏览器，它的出现是一个虚拟点无限循环动画；然而，一旦你的价值属性（没有价值），例如，也被认为是确定虚拟点动画成仙方式mdash；mdash；变截面>，如下：
（3）位置是只读的，顾认为，当前位置的进度是值最大值。如果进度条不确定，则值是- 1。
（4）标签是一个只读属性，得到标签元素指向进步的元素。例如，document.queryselector（进步），标签，它返回htmlcollection，是截图我的试验（从Opera浏览器切断。现在firefox18.0.2和IE10似乎不支持）。

二、进度元素兼容性处理示例
HTML代码

xml代码将内容复制到剪贴板。

CSS代码兼容

CSS代码将内容复制到剪贴板。
进步{
显示：内联块；
宽度：160px；
身高：20px；
边境：1px solid # 0064b4；
背景颜色：# e6e6e6；
颜色：# 0064b4； / * * / IE10
}
/ * * / IE6-IE9
进展即{
显示块；
身高：100%；
背景：# 0064b4；
}
进展：：-个进度条{背景：# 0064b4；}
进展：：- WebKit的进度条{背景：# e6e6e6；}
进展：进展：WebKit的价值{背景：# 0064b4；}

基本上是解决各种浏览器差异的完美方法。