有沒有辦法連接CSS和UI自定義類

有沒有辦法連接CSS樣式和UI自定義類。例如，創建繼承UIButton類的類並向它們添加CSS樣式。可能嗎？有沒有辦法連接CSS和UI自定義類

編輯我的CSS：

.button { 
    border: 3px solid #0a3c59; 
    background: #3e779d; 
    background: -webkit-gradient(linear, left top, left bottom, from(#65a9d7), to(#3e779d)); 
    background: -webkit-linear-gradient(top, #65a9d7, #3e779d); 
    background: -moz-linear-gradient(top, #65a9d7, #3e779d); 
    background: -ms-linear-gradient(top, #65a9d7, #3e779d); 
    background: -o-linear-gradient(top, #65a9d7, #3e779d); 
    background-image: -ms-linear-gradient(top, #65a9d7 0%, #3e779d 100%); 
    padding: 20px 40px; 
    -webkit-border-radius: 10px; 
    -moz-border-radius: 10px; 
    border-radius: 10px; 
    -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0; 
    -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0; 
    box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0; 
    text-shadow: #7ea4bd 0 1px 0; 
    color: #06426c; 
    font-size: 9px; 
    font-family: helvetica, serif; 
    text-decoration: none; 
    vertical-align: middle; 
} 
.button:hover { 
    border: 3px solid #0a3c59; 
    text-shadow: #1e4158 0 1px 0; 
    background: #3e779d; 
    background: -webkit-gradient(linear, left top, left bottom, from(#65a9d7), to(#3e779d)); 
    background: -webkit-linear-gradient(top, #65a9d7, #3e779d); 
    background: -moz-linear-gradient(top, #65a9d7, #3e779d); 
    background: -ms-linear-gradient(top, #65a9d7, #3e779d); 
    background: -o-linear-gradient(top, #65a9d7, #3e779d); 
    background-image: -ms-linear-gradient(top, #65a9d7 0%, #3e779d 100%); 
    color: #fff; 
} 
.button:active { 
    text-shadow: #1e4158 0 1px 0; 
    border: 3px solid #0a3c59; 
    background: #65a9d7; 
    background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#3e779d)); 
    background: -webkit-linear-gradient(top, #3e779d, #65a9d7); 
    background: -moz-linear-gradient(top, #3e779d, #65a9d7); 
    background: -ms-linear-gradient(top, #3e779d, #65a9d7); 
    background: -o-linear-gradient(top, #3e779d, #65a9d7); 
    background-image: -ms-linear-gradient(top, #3e779d 0%, #65a9d7 100%); 
    color: #fff; 
}

而我的類是從UIButton的類繼承，沒有任何其他的變化。我只想添加CSS屬性。

來源

2012-08-26 RomanHouse

是的，它是可能的，您可以更改/添加新的CSS屬性，但有點複雜，以確保如果沒有添加JavaScript的影響... –

你能給我一些例子或鏈接到一些教程？ – RomanHouse

檢查這個問題，我認爲這可能對你有所幫助.. http://stackoverflow.com/questions/1308369/jquery-ui-dialog-individual-css-styling –

它應該工作。

<script> 
jQuery(function(){ 
    // add your own class 
    jQuery(".button").addClass("ui-button-new-css"); 

    jQuery(".button.ui-button-new-css").hover(function(){ 
     jQuery(this).addClass("ui-button-new-css-hover"); 
    }, function(){ 
     jQuery(this).removeClass("ui-button-new-css-hover"); 
    }); 

    jQuery(".button.ui-button-new-css").focus(function(){ 
     jQuery(this).addClass("ui-button-new-css-active"); 
    }); 

    jQuery(".button.ui-button-new-css").blur(function(){ 
     jQuery(this).removeClass("ui-button-new-css-active"); 
    }); 
}); 
</script> 

<style> 
    .button.ui-button-new-css { 
     /* your new css property */ 
    } 
    .button.ui-button-new-css.ui-button-new-css-hover { 
     /* your new hover css property */ 
    } 
    .button.ui-button-new-css.ui-button-new-css-active { 
     /* your new active css property */ 
    } 
</style>

來源

2012-08-27 10:12:59

有沒有辦法連接CSS和UI自定義類

回答

相關問題