Question

尝试使用bootstrap glyphicon创建一个简单的链接。在悬停时，background-color的{{1}}会更改以及字形的字体a。

然而，当尝试添加css color时，过渡依次出现（首先是bgcolor，然后是内容的颜色），而不是并行。

我试过了：

transition

和

.alltransition, .alltransition *
{
-webkit-transition:background-color .2s linear, color .2s linear;
-moz-transition: background-color .2s linear, color .2s linear;
-o-transition: background-color .2s linear, color .2s linear;
transition: background-color .2s linear, color .2s linear;
}

HTML

.alltransition, .alltransition *
{
-webkit-transition:all .2s linear;
-moz-transition:all .2s linear;
-o-transition: all .2s linear;
transition: all .2s linear;
}

JS FIDDLE

Answer 1

您是否尝试删除.alltransition *？或者<span>有自己的过渡是你的目标吗？

所以你的.alltransition课程看起来像这样 -

.alltransition{
    -webkit-transition:all .2s linear;
    -moz-transition:all .2s linear;
    -o-transition: all .2s linear;
    transition: all .2s linear;
}

Fiddle

Fiddle - span color change

如何在嵌套元素上并行创建两个CSS过渡

1 个答案: