按钮CSS样式

最新推荐文章于 2024-04-20 19:40:16 发布

zzm_

最新推荐文章于 2024-04-20 19:40:16 发布

阅读量124

点赞数

文章标签： javascript ViewUI

CreateTime--2017年5月5日11:23:18
Author:Marydon

按钮CSS样式

实现效果：

<input type="button" onclick="" class="Button" style="margin-left:40px;" value="" onmouseover="javascript:this.className='ButtonOver'" 
　　onmouseout="javascript:this.className='Button'"/>

/* 查询按钮style start */
.Button {
    width: 80px;
    margin: 3px 1px 0 5px;
    padding: 0 10px;
    background-color: #16a0d3;
    border: none;
    display: inline-block;
    font-family: "Microsoft Yahei";
    font-size: 12px;
    cursor: pointer;
    height: 27px;
    line-height: 27px;
    color: #FFF;
    border-radius: 5px;
}

.ButtonOver {
    width: 80px;
    margin: 3px 1px 0 5px;
    padding: 0 10px;
    background-color: #117ea6;
    border: none;
    display: inline-block;
    font-family: "Microsoft Yahei";
    font-size: 12px;
    cursor: pointer;
    height: 27px;
    line-height: 27px;
    color: #FFF;
    border-radius: 5px;
}    
/* end 查询按钮style */