Mozilla浏览器中HTML 5的样式进度标记

时间:2016-06-02 07:16:33

标签: html5

我不太熟悉HTML 5中的进度条样式。当我在Mozilla浏览器上运行时,有人可以帮我删除进度条的边框轮廓。

progress[value] {
  /* Reset the default appearance */
  -webkit-appearance: none;
  -moz-appearance:none;
  appearance: none;
}
progress::-moz-progress-bar {
  background: #FF5800;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
}
<progress id="progress_fileUpload" value="60" max="100"></progress>

输出:

enter image description here

2 个答案:

答案 0 :(得分:0)

添加 border:none;到你当前的css:)

你提供的代码也没有显示与图片显示相同的代码我推荐使用相同的代码来获得更好的帮助

答案 1 :(得分:0)

在我的css代码中,我只需添加:

progress {
    color: #FF5800;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
    border:none;
}

它在Mozilla中运行良好:)

&#13;
&#13;
progress[value] {
  /* Reset the default appearance */
  -webkit-appearance: none;
  -moz-appearance:none;
  appearance: none;
}
progress::-moz-progress-bar {
  background: #FF5800;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
}
   
&#13;
<progress id="progress_fileUpload" value="60" max="100"></progress>
&#13;
&#13;
&#13;