微软风格的按钮
2004-11-03 12:45
190 查看
<html>
<head>
<style>
.button2
{
border-right:1px solid buttonhighlight;
border-left:1px solid buttonshadow;
border-bottom:1px solid buttonhighlight;
border-top:1px solid buttonshadow
}
TD
{
cursor: hand; font-size: 9pt; font-family: 宋体; text-align: center; text-valign: middle
}
.handin
{
height:18px;
width:2px;
border-left:1px solid buttonshadow;
border-right:1px solid buttonhighlight
}
.handout
{
height:18px;
width:2px;
border-left:1px solid buttonhighlight;
border-right:1px solid buttonshadow;
}
.into
{
width:100%;
border-right:1px solid buttonhighlight;
border-left:1px solid buttonshadow;
border-bottom:1px solid buttonhighlight;
border-top:1px solid buttonshadow
}
.outto,.button1
{
background-color: buttonface;
background-repeat: repeat;
background-attachment: scroll;
border-left: 1px solid buttonhighlight;
border-right: 1px solid buttonshadow;
border-top: 1px solid buttonhighlight;
border-bottom: 1px solid buttonshadow;
background-position: 0%"
}
.button0
{
}
</style>
</head>
<body topmargin="0" leftmargin="0" bgcolor="#E0E0E0">
<script>
function change_button(num)
{
if(event.srcElement.tagName=="TD"&&event.srcElement.value=="button")
event.srcElement.className = "button"+num;
}
</script>
<div class="into" style="width: 100%; height: 25">
<table class="outto" border="0" width="100%" height="25" cellspacing="1" onmouseover="change_button(1)" onmouseup="change_button(0)" onmousedown="change_button(2)" onmouseout="change_button(0)">
<tr>
<td width="1%" height="19"><span class="handout"></span></td>
<td width="9%" height="19" value="button">按钮TD</td>
<td width="1%" height="19"><span class="handin"></span></td>
<td width="9%" height="19" value="button">按钮TD</td>
<td width="1%" height="19"><span class="handin"></span></td>
<td width="9%" height="19" value="button">按钮TD</td>
<td width="1%" height="19"><span class="handin"></span></td>
<td width="69%" height="19"></td>
</tr>
</table>
</div>
</body>
</html>
<head>
<style>
.button2
{
border-right:1px solid buttonhighlight;
border-left:1px solid buttonshadow;
border-bottom:1px solid buttonhighlight;
border-top:1px solid buttonshadow
}
TD
{
cursor: hand; font-size: 9pt; font-family: 宋体; text-align: center; text-valign: middle
}
.handin
{
height:18px;
width:2px;
border-left:1px solid buttonshadow;
border-right:1px solid buttonhighlight
}
.handout
{
height:18px;
width:2px;
border-left:1px solid buttonhighlight;
border-right:1px solid buttonshadow;
}
.into
{
width:100%;
border-right:1px solid buttonhighlight;
border-left:1px solid buttonshadow;
border-bottom:1px solid buttonhighlight;
border-top:1px solid buttonshadow
}
.outto,.button1
{
background-color: buttonface;
background-repeat: repeat;
background-attachment: scroll;
border-left: 1px solid buttonhighlight;
border-right: 1px solid buttonshadow;
border-top: 1px solid buttonhighlight;
border-bottom: 1px solid buttonshadow;
background-position: 0%"
}
.button0
{
}
</style>
</head>
<body topmargin="0" leftmargin="0" bgcolor="#E0E0E0">
<script>
function change_button(num)
{
if(event.srcElement.tagName=="TD"&&event.srcElement.value=="button")
event.srcElement.className = "button"+num;
}
</script>
<div class="into" style="width: 100%; height: 25">
<table class="outto" border="0" width="100%" height="25" cellspacing="1" onmouseover="change_button(1)" onmouseup="change_button(0)" onmousedown="change_button(2)" onmouseout="change_button(0)">
<tr>
<td width="1%" height="19"><span class="handout"></span></td>
<td width="9%" height="19" value="button">按钮TD</td>
<td width="1%" height="19"><span class="handin"></span></td>
<td width="9%" height="19" value="button">按钮TD</td>
<td width="1%" height="19"><span class="handin"></span></td>
<td width="9%" height="19" value="button">按钮TD</td>
<td width="1%" height="19"><span class="handin"></span></td>
<td width="69%" height="19"></td>
</tr>
</table>
</div>
</body>
</html>
相关文章推荐
- 仿微软风格的按钮演示
- 定制navgation上的按钮,设置自己的风格的UIBarButtonItem
- js实现iPhone界面风格的单选框和复选框按钮实例
- 虚幻4(兼容4.18)官方文档整理翻译UMG按钮风格
- XP风格的按钮代码
- UIBarButtonItem系统自带的按钮风格
- 用CSS风格的文本和图形构建网页实用按钮
- C++ VC 开发3D风格按钮控件
- Silverlight 苹果风格按钮Mac OS Style 实现的更新版
- 论坛源码推荐(2月28日):Xcode 5代码自动补全插件 iOS 7风格的导航栏按钮
- Qt使用styleSheet制作XP风格的按钮
- Android 自定义View学习(3)--仿IOS风格滑动按钮
- 学习MFC中各个控件的源码下载:比如自绘按钮的各种风格
- 制作风格独特的按钮—用VC6扩展CButton
- [效果演示]仿Win8风格按钮&边栏
- 改变按钮风格去掉边框
- 从CButton继承产生链接风格按钮
- XP环境下2000风格按钮手工修改改变成XP风格的方法
- 微软风格的CSS横向菜单
- 使用GDI+绘制的360风格按钮控件(使用CN_DRAWITEM消息重绘,并使用TGPGraphics,TGPPen,TGPImage,TGPBitmap等)good