Hover

Hoverに使用するCSS

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

  • DEMO
underline
back ground
shadow

Class Copy

使い方

[underline]と[shadow]は、hover用のクラスでなく、TextとEffectとの併用可能。

  • CSS
.hov {transition: 0.2s;}

  .hov.underline:hover ,
  .hov.txt:hover {text-decoration: underline;}
  
  .hov.bg:hover {background: var(--hover);}
  
  .hov.sdw:hover ,
  .hov.shadow:hover {box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 4px -1px, rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px;}