CSS Transition Effect ::文本改变颜色，但不改变边框

Question

我试图将过渡效果应用于某些图标。转换适用于字体（FontAwesome），但不适用于边框，我不知道为什么。自昨天以来一直在尝试，通过网络梳理，包括stackoverflow，但没有。

您可以看到示例here，以下是代码：

.social-nets-wrapper .social li a {color: rgb(53, 61, 68); font-size: 35px; border-color: #272F37;}

.social-nets-wrapper .social li a::before {background-color: #272f37;}

.social-nets-wrapper .social li a:hover {color: #f7941e; border-color: #f7941e; transition: all 300ms linear 0s;}

非常感谢任何建议。

Answer 1

您已在CSS的某个位置设置：

.social-nets-wrapper .social li a:hover {
    text-decoration: none;
    border-color: #FFF !important;
}

然后，你需要把：

.social-nets-wrapper .social li a:hover {
    color: #F7941E;
    border-color: #F7941E !important; /* add !important to override */
    transition: all 300ms linear 0s;
}

或者更好的是，找到错误的声明并使用正确的声明进行修复。