改變字體 - 令人敬畏的星形圖標的顏色

Question

我有一個字體真棒星-o圖標和onclick我想將其顏色設置為黃色。 有人能幫我嗎？

<div id="favourite_star"> <span class="fa-stack fa-lg left"> <i class="fa fa-square-o fa-stack-2x"></i> <i class="fa fa-fw fa-lg fa-star-o fa-stack-1x favourite_icon" onclick="setLocally()"></i></span> </div>

我只想讓星內的顏色設置為黃色。 我嘗試使用jquery將顏色設置為黃色，但它只將星形邊緣設置為黃色，然后我嘗試將背景顏色設置為黃色然后將整個方塊設置為黃色。

Answer 1

您必須更改.star的星級而不是.star-o

所以

// HTML
<i class="fa fa-fw fa-lg fa-star-o fa-stack-1x favourite_icon"></i>

// JS
$(".favourite_icon").click(function(){
 $(this).css({"color": "yellow"}).removeClass('fa-star-o').addClass('fa-star');
});

Answer 2

嘗試這個：-

 <!DOCTYPE html> <html> <head> <title>Font Awesome Icons</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"> </head> <body> <i class="fa fa-star" style="font-size:48px;color:yellow"></i> <br> </body> </html>

或試試這個

 <!DOCTYPE html> <html> <head> <title>Font Awesome Icons</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"> </head> <body> <h1>fa fa-star</h1> <i class="fa fa-star"></i> <i class="fa fa-star" style="font-size:24px"></i> <i class="fa fa-star" style="font-size:36px"></i> <i class="fa fa-star" style="font-size:48px;color:yellow"></i> <br> <p>Used on a button:</p> <button style="font-size:24px">Button <i class="fa fa-star"></i></button> <p>Unicode:</p> <i style="font-size:24px" class="fa">&#xf005;</i> </body> </html>

改變字體 - 令人敬畏的星形圖標的顏色

問題描述

2 個解決方案

解決方案1
2 已采納 2016-10-29 18:47:26

解決方案2
1 2016-10-29 19:00:12

改變字體 - 令人敬畏的星形圖標的顏色

問題描述

2 個解決方案

解決方案1 2 已采納 2016-10-29 18:47:26

解決方案2 1 2016-10-29 19:00:12

解決方案1
2 已采納 2016-10-29 18:47:26

解決方案2
1 2016-10-29 19:00:12