在过去的Web开发中，通常使用Photoshop来设计按钮的样式。不过随着CSS3技术的发展，你完全可以通过几行代码来定制一个漂亮的按钮，并且还可以呈现渐变、框阴影、文字阴影等效果。此类按钮最大的优势是省去了加载图片的步骤，并且非常易于编辑、扩展和定制，你只需要更改代码即可。

本文收集了10套基于CSS3的按钮，你可以通过复制粘贴代码到你的CSS文件中来使用这些按钮。但需要注意的是，CSS3需要浏览器的支持，基本上这些按钮可以在大部分现代浏览器中完美呈现，但是在IE中支持还不够好。

1. 漂亮的CSS3按钮

2. 放射效果按钮

3. CSS3立体按钮

4. 基于伪元素的CSS按钮

5. Github风格的按钮

6. 社交媒体按钮

7. 糖果风格按钮

8. 基于RGBA的CSS3按钮

9. CSS3按钮集合

10. 长条形3D CSS3按钮

原文：http://www.iteye.com/news/24803
英文原文：10 GORGEOUS CSS3 BUTTONS, READY TO BE USED!

html页面button样式的更多相关文章

  1. 【译文】CSS技术：如何正确的塑造button样式！

    , but useful for */ display: inline-block; text-align: center; text-decoration: none; /* create a sm ...

  2. 微信小程序之分享或转发功能（自定义button样式）

    小程序页面内发起转发 通过给 button 组件设置属性open-type="share",可以在用户点击按钮后触发 Page.onShareAppMessage 事件,如果当前页 ...

  3. 纯css3手机页面图标样式代码

    全部图标:http://hovertree.com/texiao/css/19/ 先看效果: 或者点这里:http://hovertree.com/texiao/css/19/hoverkico.ht ...

  4. Form认证导致登陆页面的样式无效和图片不能显示的原因

    最近在做企业内门户网站,一切进展还算顺利,部署到生产环境的时候也能没有什么大问题,只是登录页面的样式不起作用,不知为何,因为是使用了login控件,最初以为是此控件有内置默认样式或者什么原因,于是就不 ...

  5. android_重写button样式

    这样的button样式应该源自IOS.假设安卓上实现,则须要使用android上面的layer-list来实现. 事实上layer-list有点像framlayout,作用就是覆盖. 先说一下实现原理 ...

  6. 项目遇到的小问题（关于vue-cli中js点击事件不起作用和iconfont图片下载页面css样式乱的解答）

     第一个:关于vue-cli中js点击事件不起作用 在vue的methods方法queryBtnFun()中拼接html和click操作事件的时候,发现点击事件一起未起作用: 后来发现是DOM执行顺序 ...

  7. 页面css样式找不到问题

    出现了一个页面没有样式的问题: 问题: 1.路径不对, 可以打开页面f12看样式是否找到 检查路径是否正确. 2.样式没引全或者没引对. 查看引入的样式是否正确或缺少样式. 3.路径明明写对了却404 ...

  8. 36种漂亮的CSS3网页按钮Button样式

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  9. android中样式和自定义button样式

    1)自定义button样式 一.采用图片方式 首先新建Android XML文件,类型选Drawable,根结点选selector,自定义一个文件名. 随后,开发环境自动在新建的文件里加了select ...

随机推荐

  1. Qt入门（12）——Qt国际化

    应用的国际化就是使应用成为能被非本国的人使用的过程.有的情况下,国际化很简单,例如,使一个US应用可被Australian或者British用户理解,工作可能少于几个拼写修正.但是使一个US应用可以被 ...

  2. Postman newman

    安装 官方文档: Newman - Running collections in the command line Installing Newman on Windows 1. 安装NodeJs 下 ...

  3. VC++ 动态检测串口的热插拔(一)通过注册表实现

    在上一篇文章中讲述了如何通过循环遍历的方法获取可用串口,可是这样的方法过于暴力,难免会想有没有其他的办法那,嘿嘿,那是肯定会有的,不管什么问题,解决问题的方法永远都不止一种.下面讲述如何通过注册表来获 ...

  4. 分布式锁 基于Redis

    分布式锁的实现(基于Redis) 参考:http://www.jb51.net/article/75439.htm http://www.linuxidc.com/Linux/2015-01/1118 ...

  5. sql server 常用小知识点

    1. sql server的语法:中文要加 N select * from eVA_EMPBoard where name = N'施纪平' 而oracle的不用 2.

  6. 通过cocos2d-x的CCGLProgram和CCShaderCache的实现来分析OpenGL ES中的Shader编程

    在OpenGL ES中,Shader是着色器,包括两种:顶点着色器(Vertex Shader)和片元着色器(Fragment Shader).每个program对象有且仅有一个Vertex Shad ...

  7. ios中框架介绍

    ios中框架介绍 参考博客: 参考文章:框架介绍 框架介绍 框架就是一个目录,一个目录包含了共享库,访问共享库里面的代码的头文件,和其他的图片和声音的资源文件.一个共享库定义的方法和函数可以被应用程序 ...

  8. 第六篇：R语言数据可视化之数据分布图（直方图、密度曲线、箱线图、等高线、2D密度图）

    数据分布图简介 中医上讲看病四诊法为:望闻问切.而数据分析师分析数据的过程也有点相似,我们需要望:看看数据长什么样:闻:仔细分析数据是否合理:问:针对前两步工作搜集到的问题与业务方交流:切:结合业务方 ...

  9. java.util.Date和java.sql.Date

    java.util.Date是在除了SQL语句的情况下面使用的. java.sql.Date是针对SQL语句使用的,它只包含日期而没有时间部分 它们都有getTime方法返回毫秒数,自然就可以直接构建 ...

  10. oracle的sql优化

    http://www.cnblogs.com/rootq/archive/2008/11/17/1334727.html