-1

如何在天线 jquery-bar-rating 中设置颜色和大小。默认颜色为蓝色。我在文档、文档页面和github页面中也找不到它。也试过搜索。找到整个页面，但如果没有提及尺寸和颜色。

<select class="rating-stars" id="rating-stars" name="rating-stars" style="font-size: 20px">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

$('.rating-stars').barrating({
     theme: 'fontawesome-stars-o',
});

最后我得到了一个解决方案：覆盖css

.br-theme-fontawesome-stars-o .br-widget a{
    font-size: 20px;
}

.br-theme-fontawesome-stars-o .br-widget a.br-selected:after {
    color: #555;
}

.br-theme-fontawesome-stars-o .br-widget a.br-active:after {
    color: #555;
}
4

1 回答 1

1

它很简单，您可以覆盖css自定义 css 文件中的类并更改颜色，请参见下面的演示

$(function() {
  $('#example').barrating({
    theme: 'fontawesome-stars'
  });
});
.br-theme-fontawesome-stars .br-widget a {
  font-size: 64px !important;
}

.br-theme-fontawesome-stars .br-widget a::after {
  color: #000 !important;
}

.br-theme-fontawesome-stars .br-widget a.br-selected::after {
  color: blue !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-bar-rating/1.2.2/jquery.barrating.min.js"></script>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-bar-rating/1.2.2/themes/fontawesome-stars.css">
<select id="example">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>

于 2017-11-28T08:37:38.773 回答