javascript - 为什么transition不能改变透明度？

Question

codepen上的代码

一点疑惑，为什么我在 .list>li 中设置了透明度没有生效，我想设置

        .list>ul{
            // -webkit-transform:scale(.8) translateY(-20%);
            opacity:.6;
            transition:all .5s .2s ease;
            // transform:translateY(10%);

        }
        .normal{
            transform:scale(1.1) translateY(10%);
            opacity:1;
            //transform:scale(1) translateY(10%);
        }

开始时缩放0.8，transition之后变成1，开始设置translateY(20%),之后变成translate(0%),如何做？

Answer 1

代码有问题

.list>ul {
    opacity: .6;
    transition: all .5s ease;
    transform: scale(0.8);
}
.normal {
    transform: scale(1);
    opacity: 1;
}

.list>ul 设置的是初始化的状态，需要用js把normal添加到ul上才能看到效果

Answer 2

transition 可以透明度吧！ 1-0.1

Answer 3

数值类的属性都可以过渡的，js给 ul 添加 .active 触发动画