如何在asp.net按钮上应用自定义jQuery UI按钮类
我一直在尝试在asp.net按钮上应用自定义的jquery ui css类,但我知道它是如何工作的 如果我使用css类和按钮控件(如所附图片(第一个按钮)就可以了。出于某些原因,我需要使用asp.net按钮,并希望它与按钮控件具有相同的外观如何在asp.net按钮上应用自定义jQuery UI按钮类,jquery,html,css,asp.net,jquery-ui,Jquery,Html,Css,Asp.net,Jquery Ui,我一直在尝试在asp.net按钮上应用自定义的jquery ui css类,但我知道它是如何工作的 如果我使用css类和按钮控件(如所附图片(第一个按钮)就可以了。出于某些原因,我需要使用asp.net按钮,并希望它与按钮控件具有相同的外观 <button id="btnLogin2" type ="button" onserverclick ="btnLogin_Click" runat="server" aria-disabled="false" role="button"
<button id="btnLogin2" type ="button" onserverclick ="btnLogin_Click" runat="server" aria-disabled="false" role="button" class="ui-button ui-widget ui-state-default cssbox-ui-corner-all cssbox-ui-corner-all:hover ui-button-text-icon-primary">
<span style="margin:-8px 94px" class="ui-button-icon-primary ui-icon cssbox-okbtn" ></span>
<span class="ui-button-text">Login</span>
</button>
js脚本应用OK按钮类
.cssbox-okbtn {
background-image: url('/images/icons/jquery_ui/ok.png') !important;
}
.cssbox-ui-corner-all {
width:265px;
border-radius: 0px;
background: none repeat scroll 0% 0% #1A7BC9;
background: linear-gradient(to bottom, #1A7BC9 0px, #1A7BC9 100%);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#1A7BC9', endColorstr='#1A7BC9');/*For IE7-8-9*/
border: 1px solid #1A7BC9;
height: 35px;
font-size: 12px;
}
.cssbox-ui-corner-all:hover {
border-radius: 0px;
background: none repeat scroll 0% 0% #9CC8F7;
color: #404040;
border: 1px solid #9CC8F7;
filter: none;
}
$(function () {
$("input:submit").button({
icons: { primary: 'cssbox-okbtn' }
}).hide().after('<button>').next().button({
icons:
{
primary: 'cssbox-okbtn'
},
label: $("input:submit").val()
});
$(函数(){
$(“输入:提交”)。按钮({
图标:{primary:'cssbox okbtn'}
}).hide().after(“”).next()按钮({
图标:
{
主要:“cssbox okbtn”
},
标签:$(“输入:提交”).val()
});
第二个是asp.net按钮
<asp:Button ID="btnLogin" Text=" Login " runat="server" CSSClass="cssbox-ui-corner-all cssbox-ui-corner-all:hover ui-button-text-icon-primary ui-button-icon-primary ui-icon cssbox-okbtn" />
页面源
<tr style="height: 22px">
<td align="center" colspan="1">
<button onclick="__doPostBack('ctl00$ContentPlaceHolder1$btnLogin2','')" id="ctl00_ContentPlaceHolder1_btnLogin2" type="button" aria-disabled="false" role="button" class="ui-button ui-widget ui-state-default cssbox-ui-corner-all cssbox-ui-corner-all:hover ui-button-text-icon-primary">
<span style="margin:-8px 94px" class="ui-button-icon-primary ui-icon cssbox-okbtn" ></span>
<span class="ui-button-text">Login</span>
</button>
<br />
<input type="submit" name="ctl00$ContentPlaceHolder1$btnLogin" value=" Login " id="ctl00_ContentPlaceHolder1_btnLogin" class="cssbox-ui-corner-all cssbox-ui-corner-all:hover ui-button-text-icon-primary ui-button-icon-primary ui-icon cssbox-okbtn" />
</td>
</tr>
登录
您是否检查了客户端的css?(在页面源代码中)是否与服务器相同。也许您需要使用客户端css属性。我在问题中添加了页面源代码。