控制页面按钮的样式

<style>
/*添加按钮的样式*/
.btnadd{border:1px solid #cccccc;width:70px;height:28px;
line-height:28px;
text-align:center;
padding-left:20px;
background:url(add.gif)}

/*删除按钮的样式*/
.btndel{border:1px solid #cccccc;width:70px;height:28px;
line-height:28px;
text-align:center;
padding-left:20px;
background:url(del.gif)}

</style>
按钮：<br />
<input type="button" id="btnadd" name="btnadd" value="添加">
<input type="button" id="btndel" name="btndel" value="删除">

<script>
//获取控件
function TheObj(sname)
{
 return document.getElementById(sname);
}

//设置按钮样式
function SetBtnClsName(sname)
{
 var sobj= TheObj(sname)
 if(sobj!=null)
 {
  sobj.className = sname;
 }
}

//设置按钮具体样式
SetBtnClsName("btnadd");
SetBtnClsName("btndel");

</script>

 

图片素材：