css3 实现水晶按钮

background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ee432e), color-stop(50%, #c63929), color-stop(50%, #b51700), color-stop(100%, #891100));

这个是中间有明显过渡痕迹的,如果需要逐渐过渡的

background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(white), to(#D7D7D9));

详情可参考http://hellohappy.org/css3-buttons/

时间: 2024-11-06 03:44:19

css3 实现水晶按钮的相关文章

水晶按钮

上一篇为大家介绍了一下关于菜单效果的制作,本篇为大家再分享一下关于水晶按钮的实现,本篇我们将不会再涉及javascript的知识,所有效果我们都将同css来实现,内容没有什么难度,学完本篇我相信大家对css的强大,一定会感到赞叹的,废话不多说,下面我们先来看一下效果: 上图中的最上面的三个按钮效果是通过css改变input标签来实现的,下面两个则是两个a标签,通过css来改变相应的样式,下面我们一起来学习一下上面的效果. 一.按钮设置: 在界面上添加三个input按钮: <input type=

winfrom 水晶按钮

闲来无事,从网上找了不少自定义控件,然后整理了一下,做了一个水晶按钮 /// <summary> /// 表示 Windows 的按钮控 /// </summary> [Description("表示 Windows 的按钮控件"), DefaultEvent("Click"), ToolboxBitmap(typeof (System.Windows.Forms.Button))] public class Button : Control

自定义水晶按钮控件

namespace 自定义水晶按钮控件 { partial class Form1 { /// <summary> /// 必需的设计器变量. /// </summary> private System.ComponentModel.IContainer components = null; /// <summary> /// 清理所有正在使用的资源. /// </summary> /// <param name="disposing&quo

9款精美别致的CSS3菜单和按钮

1.超具立体感的CSS3 3D菜单 菜单项带小图标 记得之前向大家分享过不少CSS3 3D菜单,比如CSS3 3D动画菜单 3D立方体菜单项和HTML5/CSS3自定义下拉框 3D卡片折叠动画,效果都很漂亮.今天我们要再分享一款更酷的CSS3 3D立体菜单,这款菜单侧躺在页面上,每个菜单项都有不错的小图标. 在线演示 源码下载 2.纯CSS3立体动画菜单 菜单项按下有内阴影 这次小编来分享一款利用纯CSS3实现的立体动画菜单,该菜单的实现非常简单,并没有太多的特效渲染,但是看起来却非常干净漂亮,

CSS3 3D分页按钮样式

<!DOCTYPE html><html><head><meta charset="utf-8" /><title>石家庄礼品公司</title><style>.ui-page{border: 0px;background: #37578C;background: -webkit-linear-gradient(#37578C, #608BAE);background: -moz-linear-grad

[CSS3] 动画暗角按钮

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> body{ position:relative; text-align: center; background:#212322; } h1{ color:#1A897A; font-family: &q

一款基于css3的动画按钮

之前为大家分享了 推荐10款纯css3实现的实用按钮.今天给大家带来一款基于css3的动画按钮.实现的效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="share-buttons"> <div class="share-button"> <div class="share-button-secondary"> <div class="share-butt

jQuery和CSS3炫酷按钮点击波特效

这是一款效果非常炫酷的jQuery和CSS3炫酷按钮点击波特效.该特效当用户在菜单按钮上点击的时候,从鼠标点击的点开始,会有一道光波以改点为原点向外辐射的动画效果,非常绚丽. 在线演示:http://www.htmleaf.com/Demo/201503151527.html 下载地址:http://www.htmleaf.com/jQuery/Buttons-Icons/201503151526.html

常用的css3鼠标悬停按钮动画特效

css3 按钮制作A标签属性hover css3带冒泡动画按钮 css3动画transform属性鼠标悬停图文列表动画效果 div CSS3动画带有的按钮_css3样式表属性动画按钮 创意CSS3属性鼠标悬停动画菜单 css3按钮动画特效大全鼠标滑过按钮动画特效 div css3 transition属性制作鼠标悬停图标导航菜单动画展示 21种css3 transition属性鼠标悬停导航条动画效果 纯div css3鼠标触碰图标背景渐变动画效果代码 css3动画鼠标滑过栏目图片滑动切换效果 c