跳到内容

填充图标

YCloud Icons 目前并不正式支持填充图标。 不过,所有图标都可以接收 SVG 属性。 因此在某些图标上仍然可以使用 fill,并且效果正常。

下面是星级评分的示例:

<!doctype html>
<html>
  <body>
    <div class="app">
      <div class="star-rating">
        <div class="stars">
          <i
            data-ycloud="star"
            fill="#111"
            stroke-width="0"
          ></i>
          <i
            data-ycloud="star"
            fill="#111"
            stroke-width="0"
          ></i>
          <i
            data-ycloud="star"
            fill="#111"
            stroke-width="0"
          ></i>
          <i
            data-ycloud="star"
            fill="#111"
            stroke-width="0"
          ></i>
          <i
            data-ycloud="star"
            fill="#111"
            stroke-width="0"
          ></i>
        </div>
        <div class="stars rating">
          <i
            data-ycloud="star"
            fill="yellow"
            stroke-width="0"
          ></i>
          <i
            data-ycloud="star"
            fill="yellow"
            stroke-width="0"
          ></i>
          <i
            data-ycloud="star-half"
            fill="yellow"
            stroke-width="0"
          ></i>
        </div>
      </div>
    </div>

    <script src="index.js"></script>
  </body>
</html>

基于 ISC 许可证发布。