jQuery打造动态渐变按钮（2）
作者：mankaiviky 来源：蓝色理想 发布时间：2010-05-10 20:21:00
标签：jquery,动态,按钮,渐变
Step1 - Photoshop
1. 新建文件
按钮的尺寸是100px X 80px，但由于我们需要创建一个有两种状态的CSS sprite背景图，所以我们在Photoshop中创建（Ctrl+N）一个长宽为200px X 160px的图片文件，如下图：
2. 创建参考线
为了使绘制按钮更容易，我们创建参考线，从标尺中拉出参考线，如果你找不到标尺，可以按Ctrl+R显示，如下图：
3. 绘制形状
选择工具面板中的矩形工具，设置圆角半径为10px，在画布上绘制形状，如下图：
4. 设置形状样式
接上图最后一步，双击层，打开图层样式窗口，设置形状的样式，首先选择渐变叠加，设置渐变颜色从#3d3d3d到#8b8b8b，如下图：
然后，选择“内发光”，设置混合模式为“正常”，不透明度为100％，颜色设置为#ffffff，图素大小设置为3像素，如下图：
之后，再选择“描边”，设置大小为1像素，位置为“内部”，颜色为黑色#000000，如下图：
0
投稿猜你喜欢
- <％@ Page Language="C#" ％><!DOCTYPE html PUBLIC &quo
用Python实现常规的静态网页抓取时，往往是用urllib2来获取整个HTML页面，然后从HTML文件中逐字查找对应的关键字。如下所示：i- 项目地址：https://github.com/ray-project/ray1、简介Ray为构建分布式应用程序提供了一个简单、通用的API
- 先说结论model.state_dict()是浅拷贝，返回的参数仍然会随着网络的训练而变化。应该使用deepcopy(model.state
- 概要：Oracle关系数据库系统以其卓越的性能获得了广泛的应用，而保证数据库的安全性 是数据库管理工作的重要内容。本文是笔者在总结Oracl
- 概要相信很多像我一样初入门前端的时候，都是基于某个模板来学。 vue-element-admin 或者 vue-element-templa
- 一、需求 + 最终实现注：只是前端实现1. 需求需求来源是因为有一个做嵌入式 C/C++的 * 做了一个远程计算器。 需求是要求支持输入一个四
- example：models中的表# modelsclass UserInfo(models.Model): id = mode
- 在这篇文章里，我们将会探索如何使用Python语言作为一个工具来检测Linux系统各种运行信息。让我们一起来学习吧。哪种Python？当我提
- 我们知道 map 和 filter 是两种有效的 Python 方法来处理可迭代对象。但是，如果你同时使用 map 和 filter，代码可
- 前段时间我通过观察韩国网站和其他作品发现了普遍存在黄金分割这样一个规律，不过只跟色相有关，明度、纯度还没做研究，今天看到论坛一篇“网页配色之
- 以下是通过Excel 的VBA连接Oracle并操作Oracle相关数据的示例Excel 通过VBA连接数据库需要安装相应的Oracle客户
- 这小节我们要介绍Go里面的流程控制以及函数操作。流程控制流程控制在编程语言中是最伟大的发明了，因为有了它，你可以通过很简单的流程描述来表达很
- 导言在前面的教程里我们学习了DataList提供了一些风格样式的属性.而且我们还学习了如何定义HeadStyle, ItemStyle, A
- 本文我们来看一下如何使用 Python 将 QQ 好友头像拼成“五一快乐”四个字。我们可以将整个实现过程分为两步：爬取 QQ 好友头像、利用
- 类 型描 述EmptyVariable 没有被初始化，它是数字的话，它的值就为0,如果它是字符串，那么它的值就为1N
- 执行以下SQL，即OK咯叻！！ SQL：alter database 数据库名称 SQL_Latin1_General_CP1_CI_AS
- 下面是具体的步骤，试用于pycharm2016(亲测）1. File-->settings-->editor--&g
- 一、行转列— case+group bymysql> CREATE TABLE `TEST_TB_GRADE` (
- //比较数组是否相同 modeler.compArray=function(array1,array2) { &nb
