楽天カード

ローディング Type1のアイコン

カテゴリローディングアニメーション
楽天トラベル
<span class="dli-loading-1"></span>
.dli-loading-1 {
  display: inline-block;
  vertical-align: middle;
  color: #666;
  line-height: 1;
  width: 1em;
  height: 1em;
  border: 0.12em solid currentColor;
  border-top-color: rgba(102, 102, 102, 0.3);
  border-radius: 50%;
  box-sizing: border-box;
  animation: rotate 1s linear infinite;
}

@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
楽天マガジン
  1. CSS LABORATORY
  2. ローディングアニメーション
  3. ローディング Type1

カテゴリ

お気に入りリストに追加しました

お問い合わせを送信しました