Vue实现一个悬浮加号按钮
简介
本文讲解如何使用html+css+js实现一个悬浮加号按钮。
效果展示
讲解
- html
<div style="display:flex;"> <v-btn fab class="floating-button" color="#2196F3" "> <span class="btn-text">+</span> </v-btn> </div>
- css
.floating-button { border: 2px solid #2196F3; position: fixed; bottom: 20%; left: 24px; border-radius: 50%; width: 60px; height: 60px; } .btn-text { margin-top: 5%; display: flex; justify-content: center; align-items: center; font-size: 50px; line-height: 1; }