用box-shadow来实现按钮按下去的效果

eg:

input{
  box-shadow: 0.5rem 0.5rem 2rem #babecc, -0.5rem -0.5rem 1rem #fff;
}

这里input有了阴影效果,看起来像立体。
https://img.hxyxyz.top/images/2020/03/22/11.png

input:hover{
box-shadwo:0 0 0 0 #babecc;
 }

这里input没有阴影,看起来像被按下去了。

https://img.hxyxyz.top/images/2020/03/22/120fca212f12143e3c.png

hxy

hxy

秦 夏

留下你的评论

快留下你的小秘密吧