zoukankan
html css js c++ java
一组很棒的button样式 (转)
Code
1
<
style
>
2
.btn
{
3
BORDER
-
RIGHT: #7b9ebd 1px solid; PADDING
-
RIGHT: 2px; BORDER
-
TOP:
4
#7b9ebd 1px solid; PADDING
-
LEFT: 2px; FONT
-
SIZE: 12px; FILTER:
5
progid:DXImageTransform.Microsoft.Gradient(GradientType
=
0
,
6
StartColorStr
=
#ffffff, EndColorStr
=
#cecfde); BORDER
-
LEFT: #7b9ebd
7
1px solid; CURSOR: hand; COLOR: black; PADDING
-
TOP: 2px;
8
BORDER
-
BOTTOM: #7b9ebd 1px solid
9
}
10
.btn1_mouseout
{
11
BORDER
-
RIGHT: #7EBF4F 1px solid; PADDING
-
RIGHT: 2px; BORDER
-
TOP:
12
#7EBF4F 1px solid; PADDING
-
LEFT: 2px; FONT
-
SIZE: 12px; FILTER:
13
progid:DXImageTransform.Microsoft.Gradient(GradientType
=
0
,
14
StartColorStr
=
#ffffff, EndColorStr
=
#B3D997); BORDER
-
LEFT: #7EBF4F
15
1px solid; CURSOR: hand; COLOR: black; PADDING
-
TOP: 2px;
16
BORDER
-
BOTTOM: #7EBF4F 1px solid
17
}
18
.btn1_mouseover
{
19
BORDER
-
RIGHT: #7EBF4F 1px solid; PADDING
-
RIGHT: 2px; BORDER
-
TOP:
20
#7EBF4F 1px solid; PADDING
-
LEFT: 2px; FONT
-
SIZE: 12px; FILTER:
21
progid:DXImageTransform.Microsoft.Gradient(GradientType
=
0
,
22
StartColorStr
=
#ffffff, EndColorStr
=
#CAE4B6); BORDER
-
LEFT: #7EBF4F
23
1px solid; CURSOR: hand; COLOR: black; PADDING
-
TOP: 2px;
24
BORDER
-
BOTTOM: #7EBF4F 1px solid
25
}
26
.btn2
{padding:
2
4
0
27
4
;font
-
size:12px;height:
23
;background
-
color:#ece9d8;border
-
1
;}
28
.btn3_mouseout
{
29
BORDER
-
RIGHT: #2C59AA 1px solid; PADDING
-
RIGHT: 2px; BORDER
-
TOP:
30
#2C59AA 1px solid; PADDING
-
LEFT: 2px; FONT
-
SIZE: 12px; FILTER:
31
progid:DXImageTransform.Microsoft.Gradient(GradientType
=
0
,
32
StartColorStr
=
#ffffff, EndColorStr
=
#C3DAF5); BORDER
-
LEFT: #2C59AA
33
1px solid; CURSOR: hand; COLOR: black; PADDING
-
TOP: 2px;
34
BORDER
-
BOTTOM: #2C59AA 1px solid
35
}
36
.btn3_mouseover
{
37
BORDER
-
RIGHT: #2C59AA 1px solid; PADDING
-
RIGHT: 2px; BORDER
-
TOP:
38
#2C59AA 1px solid; PADDING
-
LEFT: 2px; FONT
-
SIZE: 12px; FILTER:
39
progid:DXImageTransform.Microsoft.Gradient(GradientType
=
0
,
40
StartColorStr
=
#ffffff, EndColorStr
=
#D7E7FA); BORDER
-
LEFT: #2C59AA
41
1px solid; CURSOR: hand; COLOR: black; PADDING
-
TOP: 2px;
42
BORDER
-
BOTTOM: #2C59AA 1px solid
43
}
44
.btn3_mousedown
45
{
46
BORDER
-
RIGHT: #FFE400 1px solid; PADDING
-
RIGHT: 2px; BORDER
-
TOP:
47
#FFE400 1px solid; PADDING
-
LEFT: 2px; FONT
-
SIZE: 12px; FILTER:
48
progid:DXImageTransform.Microsoft.Gradient(GradientType
=
0
,
49
StartColorStr
=
#ffffff, EndColorStr
=
#C3DAF5); BORDER
-
LEFT: #FFE400
50
1px solid; CURSOR: hand; COLOR: black; PADDING
-
TOP: 2px;
51
BORDER
-
BOTTOM: #FFE400 1px solid
52
}
53
.btn3_mouseup
{
54
BORDER
-
RIGHT: #2C59AA 1px solid; PADDING
-
RIGHT: 2px; BORDER
-
TOP:
55
#2C59AA 1px solid; PADDING
-
LEFT: 2px; FONT
-
SIZE: 12px; FILTER:
56
progid:DXImageTransform.Microsoft.Gradient(GradientType
=
0
,
57
StartColorStr
=
#ffffff, EndColorStr
=
#C3DAF5); BORDER
-
LEFT: #2C59AA
58
1px solid; CURSOR: hand; COLOR: black; PADDING
-
TOP: 2px;
59
BORDER
-
BOTTOM: #2C59AA 1px solid
60
}
61
.btn_2k3
{
62
BORDER
-
RIGHT: #002D96 1px solid; PADDING
-
RIGHT: 2px; BORDER
-
TOP:
63
#002D96 1px solid; PADDING
-
LEFT: 2px; FONT
-
SIZE: 12px; FILTER:
64
progid:DXImageTransform.Microsoft.Gradient(GradientType
=
0
,
65
StartColorStr
=
#FFFFFF, EndColorStr
=
#9DBCEA); BORDER
-
LEFT: #002D96
66
1px solid; CURSOR: hand; COLOR: black; PADDING
-
TOP: 2px;
67
BORDER
-
BOTTOM: #002D96 1px solid
68
}
69
.test
{
70
200px;
71
}
72
73
</
style
>
74
75
<
button
class
=
"
btn test
"
>
Button样式(btn)
</
button
><
br
/><
br
/>
76
<
button
class
=
"
btn1_mouseout test
"
>
Button样式(btn1_mouseout)
</
button
><
br
/><
br
/>
77
<
button
class
=
"
btn1_mouseover test
"
>
Button样式(btn1_mouseover)
</
button
><
br
/><
br
/>
78
<
button
class
=
"
btn2 test
"
>
Button样式(btn2)
</
button
><
br
/><
br
/>
79
<
button
class
=
"
btn3_mouseout test
"
>
Button样式(btn3_mouseout)
</
button
><
br
/><
br
/>
80
<
button
class
=
"
btn3_mouseover test
"
>
Button样式(btn3_mouseover)
</
button
><
br
/><
br
/>
81
<
button
class
=
"
btn3_mousedown test
"
>
Button样式(btn3_mousedown)
</
button
><
br
/><
br
/>
82
<
button
class
=
"
btn3_mouseup test
"
>
Button样式(btn3_mouseup)
</
button
><
br
/><
br
/>
83
<
button
class
=
"
btn_2k3 test
"
>
Button样式(btn_2k3)
</
button
><
br
/><
br
/>
84
<
button
class
=
"
btn3_mouseout test
"
onmouseover
=
"
this.className='btn3_mouseover test'
"
onmouseout
=
"
this.className='btn3_mouseout test'
"
onmousedown
=
"
this.className='btn3_mousedown test'
"
>
Button全功能样式
</
button
><
br
/><
br
/>
85
查看全文
相关阅读:
python 3.5.2安装mysql驱动报错
mysql创建用户
Centos7 修改SSH 端口
centos 7 升级后yum install出现Exiting on user cancel
centos7 systemctl 启动 Redis 失败
redis 异常解决办法
用普通用户通过sudo进行启动tomcat时报如下异常
svn迁移到git仓库并保留commit历史记录
CentOS更新yum源
django 添加comments app
原文地址:https://www.cnblogs.com/guanjie20/p/1504433.html
最新文章
kafka和websocket实时数据推送
一名3年工作经验的程序员应该具备的技能
$(document).ready和window.onload的区别
cnblogs反对按钮点击测试
xshell连接centos vi编辑器不能使用小键盘
Linux系统vi编辑器提示E325: ATTENTION的解决方法
CSS特效(弧光效果)
BigDecimal的用法详解(保留两位小数,四舍五入,数字格式化,科学计数法转数字,数字里的逗号处理)
使用 Chrome 开发者工具进行 JavaScript 问题定位与调试
面试题04_替换空格_剑指Offer系列
热门文章
RefreshListView中onItemClick点击错位
迅为4412开发板Linux驱动教程——编写简单应用调用驱动
BCG在程序中的使用
特征降维 理论
4、Cocos2dx 3.0游戏开发找小三之Hello World 分析
迁移Windows下的MySQL时字符乱码问题
MVC 笔记
【Android开发VR实战】二.播放360°全景视频
Material Design学习之 ProgreesBar
yum install 安装时报yum doesn't have enough cached data to continue.
Copyright © 2011-2022 走看看