最小化的CSS样式适用于步进向导

Question

我有两个材料设计向导选择器插件，一个是缩小版本的CSS，另一个是扩展版本。 步进单击时两者的行为不同。 我想知道缩小的文件是否没有采用.step-wizard .progressbar类的过渡效果。

即使代码相似，也请提出造成此更改的原因是什么，一个缩小，另一个扩展。

-webkit-transition: width 0.6s ease;
  -o-transition: width 0.6s ease;
  transition: width 0.6s ease;

缩小的CSS插件：

精简的CSS步进向导

扩展CSS插件

扩展的CSS步进向导

Answer 1

步进单击在两个版本上都可以正常工作，唯一的区别是我看到.progressbar下的边框不同。

扩展了：

border: 1px solid e5e6e6;

缩小有：

border:1px solid;

Answer 2

我发现了你的错字。 您的颜色代码有误。

您的颜色代码是

.progressbar {
position: absolute;
background-color: #0aa89e;
opacity: 0.4;
height: 12px;
border: 1px solid e5e6e6; // have a look here. color code has no #

}

你需要这样改变

.progressbar {
position: absolute;
background-color: #0aa89e;
opacity: 0.4;
height: 12px;
border: 1px solid #e5e6e6; // you need to change color code 

}

Answer 3

通过移除border: 1px solid e5e6e6;修复border: 1px solid e5e6e6; 来自.step-wizard .progressbar-stepper类

连结这里