按钮CSS样式

原创

Marydon 2023-03-01 16:55:22 博主文章分类：Css ©著作权

文章标签 CSS d3 html 文章分类 代码人生

©著作权归作者所有：来自51CTO博客作者Marydon的原创作品，请联系作者获取转载授权，否则将追究法律责任

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

按钮CSS样式

实现效果：

按钮CSS样式_html

<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 */