彩色渐变边框按钮 - CSS 笔记

这是一款来自华为荣耀官方的彩色边框按钮，看起来很是时尚，充满年轻人的活力。很适合用在一些需要展示特色的地方。

• 代码来源：详情

效果如下：

切换产品

原理分析：

先做彩色背景，然后用 margin 撑出 1 像素的边距，用 padding 做出白色背景，看起来就像是彩色渐变的边框

如何使用？

点击下方的 Demo 按钮，右击鼠标查看源代码，根据代码注释复制代码到自己需要的地方，例如古登堡的 HTML 区块或是小工具里面的“自定义 HTML”，另外，记得看代码注释哦(。・∀・)ノ