设置asp.net按钮的样式

我是Asp.net的新手，如果这是初级的，那么很抱歉。我想让按钮控件看起来有点像

我正在使用一个我以前使用过的CSS文件，它将以某种方式设置我的标签的样式

如果使用asp.net按钮控件，如何将此样式应用于按钮控件

我试着设置CSSClass='button'，但不起作用。我在asp.net按钮控件周围放置了标记，但这只会使asp.net位于样式化按钮的内部

你知道我需要做什么吗

谢谢你的帮助

/******************** Button ********************/
button,
.big-button {
    display: inline-block;
    border: 1px solid;
    border-color: #50a3c8 #297cb4 #083f6f;
    background: #0c5fa5 url(../images/old-browsers-bg/button-element-bg.png) repeat-x left top;
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
    background: -moz-linear-gradient(
        top,
        white,
        #72c6e4 4%,
        #0c5fa5
    );
    background: -webkit-gradient(
        linear,
        left top, left bottom,
        from(white),
        to(#0c5fa5),
        color-stop(0.03, #72c6e4)
    );
    -moz-border-radius: 0.333em;
    -webkit-border-radius: 0.333em;
    -webkit-background-clip: padding-box;
    border-radius: 0.333em;
    color: white;
    -moz-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    -webkit-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    font-size: 1.167em;
    padding: 0.286em 1em 0.357em;
    line-height: 1.429em;
    cursor: pointer;
    font-weight: bold;
    }
    /* IE class */
    .ie button {
        overflow: visible;
    }
    /* IE class */
    .ie7 button {
        padding-top: 0.357em;
        padding-bottom: 0.214em;
        line-height: 1.143em;
    }
    button img,
    .big-button img {
        margin-bottom: -3px;
    }
    button:hover,
    .big-button:hover {
        border-color: #1eafdc #1193d5 #035592;
        background: #057fdb url(../images/old-browsers-bg/button-element-hover-bg.png) repeat-x left top;
        background: -moz-linear-gradient(
            top,
            white,
            #2bcef3 4%,
            #057fdb
        );
        background: -webkit-gradient(
            linear,
            left top, left bottom,
            from(white),
            to(#057fdb),
            color-stop(0.03, #2bcef3)
        );
    }
    button:active,
    .big-button:active {
        border-color: #5b848b #b2def1 #b2def1 #68a6ba;
        background: #3dbfed url(../images/old-browsers-bg/button-element-active-bg.png) repeat-x top;
        background: -moz-linear-gradient(
            top,
            #89e7f9,
            #3dbfed
        );
        background: -webkit-gradient(
            linear,
            left top, left bottom,
            from(#89e7f9),
            to(#3dbfed)
        );
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    button.red,
    .red button,
    .big-button.red,
    .red .big-button {
        color: white;
        border-color: #bf3636 #5d0000 #0a0000;
        background: #790000 url(../images/old-browsers-bg/button-element-red-bg.png) repeat-x top;
        background: -moz-linear-gradient(
            top,
            white,
            #ca3535 4%,
            #790000
        );
        background: -webkit-gradient(
            linear,
            left top, left bottom,
            from(white),
            to(#790000),
            color-stop(0.03, #ca3535)
        );
        }
        button.red:hover,
        .red button:hover,
        .big-button.red:hover,
        .red .big-button:hover {
            border-color: #c24949 #9d3d3d #590909;
            background: #9d0404 url(../images/old-browsers-bg/button-element-red-hover-bg.png) repeat-x top;
            background: -moz-linear-gradient(
                top,
                white,
                #fe6565 4%,
                #9d0404
            );
            background: -webkit-gradient(
                linear,
                left top, left bottom,
                from(white),
                to(#9d0404),
                color-stop(0.03, #fe6565)
            );
        }
        button.red:active,
        .red button:active,
        .big-button.red:active,
        .red .big-button:active {
            border-color: #7c5656 #f7cbcb #f7cbcb #a15151;
            background: #ff5252 url(../images/old-browsers-bg/button-element-red-active-bg.png) repeat-x top;
            background: -moz-linear-gradient(
                top,
                #ff9d9d,
                #ff5252
            );
            background: -webkit-gradient(
                linear,
                left top, left bottom,
                from(#ff9d9d),
                to(#ff5252)
            );
        }

    button:disabled,
    button:disabled:hover,
    .big-button.disabled,
    .big-button.disabled:hover {
        color: #bfbfbf;
        border-color: #e9f2f6 #c4c3c3 #a2a2a2 #e3e2e2;
        background: #c8c8c8 url(../images/old-browsers-bg/button-element-disabled-bg.png) repeat-x top;
        background: -moz-linear-gradient(
            top,
            #f0f2f2,
            #c8c8c8
        );
        background: -webkit-gradient(
            linear,
            left top, left bottom,
            from(#f0f2f2),
            to(#c8c8c8)
        );
        -moz-text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.75);
        -webkit-text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.75);
        text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.75);
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        cursor: auto;
    }
    /* IE class */
    button.disabled,
    button.disabled:hover {
        color: #bfbfbf;
        border-color: #e9f2f6 #c4c3c3 #a2a2a2 #e3e2e2;
        background: #c8c8c8 url(../images/old-browsers-bg/button-element-disabled-bg.png) repeat-x top;
        cursor: auto;
    }

    button.grey,
    .big-button.grey {
        color: white;
        border-color: #a1a7ae #909498 #6b7076;
        background: #9fa7b0 url(../images/old-browsers-bg/button-element-grey-bg.png) repeat-x top;
        background: -moz-linear-gradient(
            top,
            white,
            #c5cbce 5%,
            #9fa7b0
        );
        background: -webkit-gradient(
            linear,
            left top, left bottom,
            from(white),
            to(#9fa7b0),
            color-stop(0.05, #c5cbce)
        );
        -moz-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
        -webkit-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
        -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
        -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
        }
        button.grey:hover,
        .big-button.grey:hover {
            border-color: #a1a7b0 #939798 #6e7275;
            background: #b1b5ba url(../images/old-browsers-bg/button-element-grey-hover-bg.png) repeat-x top;
            background: -moz-linear-gradient(
                top,
                white,
                #d6dadc 4%,
                #b1b5ba
            );
            background: -webkit-gradient(
                linear,
                left top, left bottom,
                from(white),
                to(#b1b5ba),
                color-stop(0.03, #d6dadc)
            );
        }
        button.grey:active
        .big-button.grey:active {
            border-color: #666666 #ffffff #ffffff #979898;
            background: #dddddd url(../images/old-browsers-bg/button-element-grey-active-bg.png) repeat-x top;
            background: -moz-linear-gradient(
                top,
                #f1f1f1,
                #dddddd
            );
            background: -webkit-gradient(
                linear,
                left top, left bottom,
                from(#f1f1f1),
                to(#dddddd)
            );
        }

    button.small,
    .big-button.small {
        font-size: 0.833em;
        padding: 0.2em 0.3em 0.3em 0.2em;
        vertical-align: 0.2em;
        }
        /* IE class */
        .ie button.small {
            padding: 0.5em 0.3em;
            vertical-align: 0.1em;
        }

    .ie7 button + button {
        margin-left: 0.25em;
    }

按钮：

<asp:Button ID="LoginButton" runat="server"  CommandName="Login" 
                        Text="Log In" type="button"
                        ValidationGroup="mainLogin" onclick="LoginButton_Click" CSSClass='button'/>

---

在调查您的CSS后，下面的几行有CSS不适用于您的问题和原因，请点击CssClass中的asp:button

button,
.big-button {

您必须以这种方式使用css

.button,
.big-button {

因此，问题是您以前错过了句点运算符 按钮

---

类选择器使用HTML类属性，并用“.”定义。您知道如何设置普通HTML按钮的样式吗？谢谢您的帮助。我试过了，但还是没有完全正确。我使用的css用于html“”标记，因此我不确定如何将其应用于asp.net控件，如果我不能将其分配为类，请复制/粘贴包含按钮和cssUgh的asp.net表单代码！这太明显了，我不敢相信我错过了。非常感谢你的帮助！