css实现立体感按钮

简介: css实现立体感按钮

<view class="envelope_bgc_chunk"></view>
   .envelope_bgc_chunk{
      width: 60rpx;
      height: 100rpx;
      background-color: #83baff;
      border-radius: 8rpx;
     // 立体按钮其实就是这一行的效果
      box-shadow: 0px 0px 2px 2px rgba(55, 114, 203,0.2),
      /*下面深蓝色立体阴影*/
      0px 0px 6px 1px #4379d0,
                        /*内部暗色阴影*/
      0 -15px 2px 2px rgba(55, 114, 203,0.10) inset;
    }
目录
相关文章
|
13天前
|
前端开发
css特效——纯css绘制图标:带框的加号(添加按钮)、三横(三道杠)、带圈点(双层圆点)
css特效——纯css绘制图标:带框的加号(添加按钮)、三横(三道杠)、带圈点(双层圆点)
18 5
|
19天前
|
前端开发
CSS动画(毛玻璃按钮)
CSS动画(毛玻璃按钮)
|
19天前
|
前端开发
CSS动画效果(鼠标滑过按钮动画)
CSS动画效果(鼠标滑过按钮动画)
|
1月前
|
前端开发
css html 渐变按钮
css html 渐变按钮
14 0
|
2月前
|
前端开发
css样式实现一个滑动按钮
css样式实现一个滑动按钮
33 0
|
11月前
|
前端开发
入门css小demo,登录按钮
入门css小demo,登录按钮
63 0
|
2月前
|
前端开发
CSS 斜体按钮
CSS 斜体按钮
CSS 斜体按钮
|
2月前
|
前端开发 JavaScript
分享几个精美的网页按钮样式,纯CSS实现,无JS(拿来即用)
分享几个精美的网页按钮样式,纯CSS实现,无JS(拿来即用)
55 0
|
2月前
|
前端开发
纯css实现的一些好看的按钮
纯css实现的一些好看的按钮
60 0