css添加按钮代码_使用Butns.css将预先设计的按钮添加到您的站点

诸如Bootstrap之类的前端框架都具有自己的按钮样式 ，但是通常没有太多变化 。

免费的Butns库提供了许多自定义按钮样式，而没有附加整个框架。 对于已经具有自定义页面设计但不想处理自己的按钮样式的开发人员来说，这是完美的选择。

您几乎有无限的选择和组合可供选择。 Butns具有30多种不同的背景/边框颜色 ，您可以混合使用这些颜色/颜色来匹配传统的平面按钮 ， 药丸按钮甚至是鬼按钮 。

您还可以在将两种不同颜色组合在一起的不同渐变样式之间进行选择。 这些渐变按钮看起来很棒，带有阴影效果，可以提高浮雕效果。

除了颜色和阴影外，您还可以更改任何按钮的形状，大小和透明度 。

所有内容都通过CSS类进行控制 ，因此您确实可以完全访问库中的所有内容。

我最喜欢Butns的地方是，只需更新一个类名 ，您就可以轻松地在不同样式之间切换 。 没有添加样式或编辑样式表的过于复杂的系统。 您只需交换课程，然后就可以开始学习了。

尽管用自己的喜好覆盖其中的某些类没有什么害处。 这就是CSS中级联效果的美。

要开始使用，只需从Butns主页或GitHub repo 下载.css文件 。 它们都链接到最新版本，因此任何一种方法都可以。

将其添加到您的网页后，只需将.button类.button到您希望形状像按钮的任何内容上即可。 从那里开始，您可以根据所需按钮的颜色，大小和样式添加其他类 。

在类列表附近查看GitHub页面。 您会找到所有类的完整列表，用于自定义颜色，按钮类型以及显示选项，例如小/大或半透明。

Butns.css很容易是网络上最全面的按钮样式表之一 。 您可以将其添加到多个Web项目中，并且使用此一个库，所有这些项目都可以具有不同的外观 。

由于类不重叠，它也可以与其他框架 （如Bootstrap） 很好地配合 。 因此，您可以轻松将Butns与市场上几乎所有其他前端框架合并。

翻译自: https://www.hongkiat.com/blog/butnscss/