我正在尝试将过渡效果应用于某些图标。过渡适用于字体(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;}


任何建议,不胜感激。

最佳答案

您已经在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;
}


或者更好的方法是,找到错误的声明并使用正确的声明对其进行修复。

关于css - CSS过渡效果::文本更改颜色,但不更改边框,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/30550246/

10-12 03:29