我最近发现了一个有意思的CSS样式库,和Bootstrap相似,但是它是专门的一个高度可定制的,免费的并且开源的按钮CSS样式库,这里附上它的网址:http://www.bootcss.com/p/buttons/

接下来介绍怎么使用这个CSS样式库,如上图,进入网址后,点击下载,会出现一个全是代码的网页,然后鼠标右键点击全选,复制,这里的代码就是这个BUTTONS的CSS样式代码,

再接下来就是在你的编辑器中创建一个css文件,然后将所复制的代码全部粘贴上去即可,然后就可以编写你的HTML代码了,当然一定要在head中引入这个css文件。(如图)

它的写法与bootstrap相似,只需要在你的标签中添加一个类名即可,当然标签只能是input/a/button

接下来介绍几种BUTTONS中的样式:

代码:

结果展示(Chrome):

这个buttons样式库个人觉得挺好的,还可以自定义按钮的背景,颜色。路过的大神感兴趣可以看一下。

thank your for watching

一个有意思的CSS样式库--BUTTONS的更多相关文章

  1. 一个简陋的 CSS 样式

    有些网友对 Smart Framewok 中的 Sample 示例的样式比较感兴趣.由于本人对前端不太精通,但为了满足网友们的需求,只好献丑了. 以下这个简陋的 CSS 样式: ? 1 2 3 4 5 ...

  2. 在input中右边加上一个图标的css样式

    https://blog.csdn.net/ffggnfgf/article/details/43384527

  3. BUTTONS V. 2.0.0——CSS按钮库

    BUTTONS-V2-CSS库样式职责 CSS库样式职责分离优点 模块样式命名更清晰化 易于维护.扩展性强 动画效果——修改样式后有过度效果,默认样式 源码如下 <!DOCTYPE html&g ...

  4. 使用sass语法生成自己的css的样式库

    前言 先说一下 sass 和 scss的区别 sass 是一种缩进语法(即没有花括号和分号,只使用换行 缩进的方式去区别子元素,PS:这是我个人的理解) scss 是css-like语法  (它的语法 ...

  5. 精简的网站reset和css通用样式库

    一.CSS reset body{ line-height:1.4; color:#; font-family:arial; font-size: 12px; } input,textarea,sel ...

  6. css样式管理

    css命名 传统网站页面(企业级),大概就是about,product,register等,他们的名字较好区分,他们的样式整体也不会很大,用简单的驼峰法就够了,或者简单的模块. 非传统企业页面,命名驼 ...

  7. [css]【转载】CSS样式分离之再分离

    原文链接:http://www.zhangxinxu.com/wordpress/2010/07/css%E6%A0%B7%E5%BC%8F%E5%88%86%E7%A6%BB%E4%B9%8B%E5 ...

  8. css样式-ime-mode text-transform

    今天遇到一个新的css样式: ime-mode   text-transform  有效小作用 取值:auto : 默认值.不影响ime的状态.与不指定 ime-mode 属性时相同 active : ...

  9. css样式表的知识点总结

    css总的来说有三种css样式可供选择: 1,行内样式表 行内样式表,直接写在了html文件的元素中,例如: <div style="color:red;"></ ...

随机推荐

  1. thinkphp的删除操作

    1.循环遍历要删除的用户的或者呀删除的文章的id值: <volist name="list" id="vo"> <tr id="si ...

  2. jQuery extend方法详解

    先说个概念的东西: jQuery为开发插件提拱了两个方法,分别是: $.fn.extend(item):为每一个实例添加一个实例方法item.($("#btn1") 会生成一个 j ...

  3. C# 两个结构相同的类进行赋值

    假入两个类A类和B类不有任何继承关系,它们属性名相同,怎么给他们互相赋值呢?下面的方法就可以了. public L SetProperties<T, L>(T t) where L : n ...

  4. Day02——Python基本数据类型

    一.运算符 1.算数运算符 2.比较运算符 3.复制运算符 4.逻辑运算符 5.成员运算符 二.基本数据类型 1.数字 整数(int) 在32位机器上,整数的位数为32位,取值范围为-2**31-2* ...

  5. 一款可以安利的MarkDown编辑器

    Typeora一款可以安利的MarkDown编辑器 Typeora是什么? ​ 一款使用MarkDown的本地编辑器集结了MarkDown的所有特点并展现了简洁.高效的特点,关键是免费. 特点: 支持 ...

  6. spring初始化完成后执行初始化数据方法

    Spring提供的解决方案三种: 1.InitializingBean package com.foriseland.fsoa.fabricca; import com.foriseland.fsoa ...

  7. io问题导致的insert缓慢

    生产环境一日常insert在业务量加倍之后非常缓慢,对有问题sql做awr报告和10046trace得出以下结论:In the 10046 trace, the execution of sql el ...

  8. ue-edit设置显示函数列表

    UltraEdit的函数列表竟然不显示函数,那这功能要它何用,应该如何才能让函数显示出来呢? 公司编程基本上都在UltraEdit中进行,俺刚来公司还不熟悉,今天装了个UltraEdit,可是看着别人 ...

  9. IOS AFN (第三方请求)

    什么是AFN全称是AFNetworking,是对NSURLConnection.NSURLSession的一层封装虽然运行效率没有ASI高,但是使用比ASI简单在iOS开发中,使用比较广泛 AFN的g ...

  10. phoneGap的Android下编写phonegap 插件

    一. javascript 端的编写  第一个参数 成功的回调函数 第二个参数 失败的回调函数 第三个参数 是插件的类名称,也就是后台java文件的类名 第四个参数 执行的 action 名称     ...