`

3款普通的按钮样式

阅读更多

3款普通的按钮样式

 

样式:

.btn1 {
    font-size: 9pt;
    color: #003399;
    border: 1px #003399 solid;
    color: #006699;
    border-bottom: #93bee2 1px solid;
    border-left: #93bee2 1px solid;
    border-right: #93bee2 1px solid;
    border-top: #93bee2 1px solid;
    background-image: url(../images/bluebuttonbg.gif);
    background-color: #e8f4ff;
    cursor: hand;
    font-style: normal;
    width: 60px;
    height: 22px;
}

.btn2 {
     font-size: 9pt; color: #003366;
     border: 0px #93bee2 solid;
     border-bottom: #93bee2 1px solid;
     border-left: #93bee2 1px solid;
     border-right: #93bee2 1px solid;
     border-top: #93bee2 1px solid;
     background-image:url(../images/blue_button_bg.gif);
     background-color: #ffffff;
     cursor: hand;
     font-style: normal ;
}

.btn3 {
    BORDER-RIGHT: #7b9ebd 1px solid;
    PADDING-RIGHT: 2px;
    BORDER-TOP: #7b9ebd 1px solid;
    PADDING-LEFT: 2px;
    FONT-SIZE: 12px;
    FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#cecfde);
    BORDER-LEFT: #7b9ebd 1px solid;
    CURSOR: hand; COLOR: black;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #7b9ebd 1px solid;
}

.btn_mouseout {
    BORDER-RIGHT: #7EBF4F 1px solid;
    PADDING-RIGHT: 2px;
    BORDER-TOP: #7EBF4F 1px solid;
    PADDING-LEFT: 2px;
    FONT-SIZE: 12px;
    FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#B3D997);
    BORDER-LEFT: #7EBF4F 1px solid;
    CURSOR: hand;
    COLOR: black;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #7EBF4F 1px solid;
}

.btn_mouseover {
    BORDER-RIGHT: #7EBF4F 1px solid;
    PADDING-RIGHT: 2px;
    BORDER-TOP: #7EBF4F 1px solid;
    PADDING-LEFT: 2px;
    FONT-SIZE: 12px;
    FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#CAE4B6);
    BORDER-LEFT: #7EBF4F 1px solid;
    CURSOR: hand;
    COLOR: black;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #7EBF4F 1px solid;
}

 
.btn_mouseup {
    BORDER-RIGHT: #2C59AA 1px solid;
    PADDING-RIGHT: 2px;
    BORDER-TOP: #2C59AA 1px solid;
    PADDING-LEFT: 2px;
    FONT-SIZE: 12px;
    FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#C3DAF5);
    BORDER-LEFT: #2C59AA 1px solid;
    CURSOR: hand;
    COLOR: black;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #2C59AA 1px solid;
}

 



 

 

 

 

 

 

  • 大小: 4 KB
  • 大小: 2.1 KB
分享到:
评论

相关推荐

    WPF 按钮样式转变和多个按钮样式转变

    普通按钮" Style="{StaticResource NormalButtonStyle}"/> 渐变按钮" Style="{StaticResource GradientButtonStyle}"/> 五角星按钮" Style="{StaticResource StarButtonStyle}"/> ``` 通过这种方式,我们可以轻松地...

    IOS源码应用Demo-ios按钮样式制作大全(20种不同风格的按钮制作方法).zip

    本资源包“IOS源码应用Demo-ios按钮样式制作大全(20种不同风格的按钮制作方法)”是一个非常实用的学习资料,尤其适用于毕业设计和论文撰写阶段的学生。这个压缩包提供了20个不同的按钮样式示例,涵盖了多种视觉...

    WebUploader照片上传,file文件图片上传样式美化,多上传按钮处理,支持IE9+

    主要涉及的元素有`webuploader-element`类的按钮样式,以及`file-list`列表中的图片预览样式。例如,可以改变按钮的背景色、边框、圆角,以及图片预览的大小、边距等。同时,可以使用JavaScript动态更新样式,如根据...

    vb的3d按钮模式

    `Button` 是标准的3D按钮样式,看起来像一个浮起的实体按钮;`Flat` 模式则让按钮看起来扁平,无明显3D效果;`Raised` 创建一个看似浮起的按钮效果;`Sunken` 创建一个看似下陷的按钮效果;`Default` 会使按钮看起来...

    css3 input按钮样式代码.zip

    2. **CSS3按钮样式**: - `border-radius`属性用于设置圆角,可以让按钮看起来更加现代和友好。 - `background-color`和`background-image`可以改变按钮的背景颜色或使用渐变、图案作为背景。 - `box-shadow`添加...

    TabControl控件带关闭按钮和多种样式

    在VB.NET环境下,我们经常会遇到需求,希望`TabControl`能够拥有更多的自定义功能,比如添加关闭按钮,或者实现不同的视觉样式。本教程将深入探讨如何通过自定义用户控件来实现一个带有关闭按钮和多种样式的`...

    很有特色的CSS3小球浮动按钮与普通按钮有所不同.zip

    标题“很有特色的CSS3小球浮动按钮与普通按钮有所不同”暗示了我们将探讨一种利用CSS3实现的独特按钮设计,这种设计与传统的HTML按钮有明显的差异。它可能涉及动画效果、3D转换、伪类选择器以及自定义字体等特性,...

    switchery-ios开关按钮样式

    总结起来,"switchery-ios"是一个用于HTML5的库,它提供了iOS风格的开关按钮样式。通过引入库的CSS和JS文件,我们可以轻松地将普通的HTML复选框转换为美观的开关,并通过JavaScript进行定制和交互处理。这个库不仅...

    9款表单复选框(Checkbox)与单选按钮美化

    开发者需要将这些文件引入到他们的项目中,按照提供的文档或示例代码进行配置,就能让普通的复选框和单选按钮焕然一新。 在实际应用中,考虑以下几点以确保优化的用户体验: 1. **一致性**:确保所有的美化样式在...

    c#自定义开关按钮,很实用

    7. **使用自定义控件**:在VS2010的设计器中,可以将`CustomSwitchButton`控件拖放到窗体上,然后像操作普通按钮一样进行布局和属性设置。 通过以上步骤,我们就可以创建一个基本的自定义开关按钮了。在实际项目中...

    按钮的三种状态(普通、聚焦、按下)

    1. **普通状态**:这是按钮的默认状态,当用户没有对按钮进行任何操作时,按钮通常显示为普通状态。在设计时,我们通常会为这个状态提供一个初始的背景和文字样式。 2. **聚焦状态**:当用户使用键盘的Tab键将焦点...

    C#自定义控件(usercontrol)--美化单选按钮和复选按钮.rar

    3. **美化单选按钮和复选框** - **样式和模板**:在C#中,我们可以使用Windows Presentation Foundation (WPF)或Windows Forms (WinForms)来改变控件的外观。WPF提供了数据绑定和样式模板等功能,可以更方便地进行...

    VB6各种图片按钮控件

    使用自定义控件时,通常需要将其添加到工具箱中,然后像普通控件一样拖放到表单上。代码可能包含对控件事件的处理,如Click、MouseEnter、MouseLeave等。 3. **原代码分析**:分析"Ibutton"的源代码可以帮助理解...

    自定义弹出框样式 alert修改

    3. **JavaScript动态生成内容**:利用JavaScript动态生成弹出框的内容,并处理关闭事件。 #### HTML与CSS代码解析 - **遮罩层**(`shield`): - 使用`position: absolute;`将其定位为绝对定位。 - 设置宽度为`...

    样式 24种分页样式

    3. 滑块样式:使用滑动条或轮盘形式,用户可以通过拖动选择页码。 4. 符号样式:使用诸如“>”、“<”等符号表示前后翻页,简洁明了。 5. 悬浮样式:分页组件常驻屏幕底部或顶部,方便用户随时切换页面。 6. ...

    ps之1000++样式

    漂亮文字的样式则包含了各种字体效果,如描边、阴影、发光、3D效果、渐变填充等,可以快速将普通文本转化为艺术字或者标题。这对于制作宣传文案、社交媒体封面或者广告设计来说,是非常方便的功能。 "很多"和"很炫...

    C#自定义开关按钮控件,c#自定义控件方法,C#

    在你的主窗体(Form)中,你可以像使用普通Button控件一样实例化并添加自定义的`MySwitchButton`: ```csharp MySwitchButton mySwitch = new MySwitchButton(); mySwitch.Location = new Point(10, 10); ...

    MFC,VC++多种风格的按钮

    2. **按钮样式**:MFC允许开发者使用各种风格的按钮,例如BS_PUSHBUTTON(普通按钮)、BS_DEFPUSHBUTTON(默认按钮)、BS_CHECKBOX(复选框)、BS_RADIOBUTTON(单选按钮)等。通过设置不同的风格,可以改变按钮的...

    6款时尚的css分页样式

    例如,通过改变按钮的背景色、边框样式和文字颜色来实现不同状态(如当前页、已访问页和普通页)的区分。此外,CSS3的过渡和动画属性可以为分页添加平滑的动态效果,如悬停时的放大或颜色变化,使用户操作更加直观和...

Global site tag (gtag.js) - Google Analytics