3

Font Awesome の JS 5 を使用して、時計とカレンダーの両方を備えたシンプルなスタック アイコンを作成したいと思います。

<script src="https://use.fontawesome.com/releases/v5.0.10/js/all.js"></script>

<span class="fa-layers fa-4x">
    <i class="far fa-calendar-alt"></i> 
    <i class="far fa-clock" data-fa-transform="shrink-6 down-6 right-6"></i>
</span>

上記のスニペットは、カレンダーが表示されないように、時計の「内側」を透明ではなく白色で塗りつぶしたいことを除いて、多かれ少なかれ私が期待するものです。

より明確にするために、これが望ましい結果です（いくつかの悪いフォトショピン​​グ...）

ここに画像の説明を入力

4

1 に答える 1

5

円形のアイコンを使用して白くし、その後ろに配置できます。

<script src="https://use.fontawesome.com/releases/v5.0.10/js/all.js"></script>

<span class="fa-layers fa-4x">
<i class="far fa-calendar-alt"></i> 
<i class="fas fa-circle" style="color:white" data-fa-transform="shrink-6 down-6 right-6"></i>
<i class="far fa-clock" data-fa-transform="shrink-6 down-6 right-6"></i>
</span>

于 2018-04-11T08:29:42.370 に答える