css - 如何设置 div 或 li 的样式使其看起来像这个进度条？

Question

我不知道这叫什么，所以我无法很好地为这个问题命名。我想要做的是制作一个栏，显示流程中的哪些步骤已完成，如下所示:

我不知道如何制作这种效果，而且因为我不知道它叫什么，所以我找不到任何示例或任何东西。

我怎样才能制作出如上图所示的东西？

Answer 1

这里是开始设计样式的好地方:http://css3button.net/81334

你正在看的是:

• 背景的 css 渐变:http://css-tricks.com/css3-gradients/

• 文本阴影

• box-shadow 设置为光细节嵌入

• 也许还有一些非常高级的 :before 和 :after 点样式: http://css-tricks.com/bubble-point-tooltips-with-css3-jquery/