CSS過渡效果::改變顏色但不是邊框的文本

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; 
} 

或者更好，找錯了聲明與正確的一個修復。