shadow

シャドウ指定

詳しい導入事例は導入方法を参照してください。

  • DEMNO
shadow
shadow-light
shadow
shadow hover

使い方

空の[data-hov]属性付与でホバーアニメーション。

  • CSS
.shadow {box-shadow: var(--shadow-main);}
.shadow-light {box-shadow: var(--shadow-light);}
@media (770px < width) {
  .shadow[data-hov]:hover {box-shadow: var(--shadow-main-hov);}
  .shadow-light[data-hov]:hover {box-shadow: var(--shadow-light-hov);}
}