padding-box/border-box 双背景做出的渐变描边，悬停整体填充
← 返回 按钮 类特效列表上方为纯 CSS 实时演示，直接将鼠标移上去 / 点击感受效果
.fx .gb{display:block;width:200px;margin:46px auto;padding:13px 0;text-align:center;border-radius:10px;font-size:15px;color:#4a9eff;cursor:pointer;border:2px solid transparent;background:linear-gradient(#161b22,#161b22) padding-box,linear-gradient(135deg,#f778ba,#4a9eff,#a371f7) border-box;transition:all .3s}
.fx .gb:hover{background:linear-gradient(135deg,#f778ba,#4a9eff) padding-box,linear-gradient(135deg,#f778ba,#a371f7) border-box;color:#fff}<div class="fx">
<button class="gb">渐变描边</button>
</div>