如何更改在sencha中選擇字段樣式

Question

我想應用我的圖像來選擇sencha中的字段。

那麼我該怎麼做。

我已經在類中創建爲

這裏是選擇現場

xtype: 'selectfield', 
       baseCls: 'x-field-select', 
       cls: 'selectclass', 
       id: 'fieldGeslacht', 
       name: 'pickergeslacht', 
       options: [ 
        { 
         text: 'Man', 
         value: 'Man' 
        }, 
        { 
         text: 'Vrouw', 
         value: 'Vrouw' 
        } 
       ], 
       usePicker: 'test', 
       component: { 
        useMask: true 
       } 

和類，我已經改變了煎茶主題的代碼是在這裏：

.selectclass 
{  
    overflow: hidden !important; 
    width: 90% !important; 
    margin-left: auto !important; 
    margin-right: auto !important; 
    color: white !important; 
    background: url("../img/registreren/2.JPG") no-repeat scroll 100% 0px #FFFFFF; 

} 

.x-selectmark-base, .x-field-select, .x-component-outer::after 
{ 
    overflow: hidden !important; 
    width: 90% !important; 
    margin-left:auto; 
    margin-right: auto !important; 
    color: white !important; 
    background: url("../img/registreren/2.JPG") no-repeat scroll 100% 0px #FFFFFF !important; 
    -webkit-mask-image:url("../img/registreren/2.JPG") !important; 
    -webkit-mask-size: 100% !important; 
} 

但是，這是不工作，所以請任何一個幫助我申請我的風格sencha選擇領域。

謝謝。

Answer 1

最近我用下面的CSS來選擇我的字段。希望這可以幫助你

.selectfield { 
display: block; 

.x-label-align-left { 
    &:first-child { 
     .x-form-label { 
     @if $include-border-radius { @include border-top-right-radius($form-fieldset-radius); } 
     } 
    } 

    &:last-child { 
     .x-form-label { 
     @if $include-border-radius { @include border-bottom-left-radius(0); } 
     } 
    }   
} 
.x-form-label { 
    span { 
     font-size: 14px; 
    } 
}  
.x-component-outer { 
    &:after { 
     margin-top: .5em; 
    } 
    &:before { 
     background: none; 
    } 
    .x-field-input{ 
     font-size: 14px; 
    } 
} 
} 

selectfield煎茶

  { 
      xtype : 'selectfield', 
      cls : 'selectfield', 
      margin : '5px', 
      usePicker : true, 
      }, 

Answer 2

嘗試只有baseCls不能同時這樣的代碼會是這樣

xtype: 'selectfield', 
       baseCls: 'selectclass', 
       id: 'fieldGeslacht', 
       name: 'pickergeslacht', 
       options: [ 
        { 
         text: 'Man', 
         value: 'Man' 
        }, 
        { 
         text: 'Vrouw', 
         value: 'Vrouw' 
        } 
       ], 
       usePicker: 'test', 
       component: { 
        useMask: true 
       }