如何更改在sencha中选择字段样式

我想应用我的图像来选择sencha中的字段。如何更改在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选择领域。

谢谢。

来源

2014-01-17 Kevin Shah

复制粘贴+文本框左右你的ExtJS的代码段。 –

不适用于选择字段。 –

在这里，我编辑我的文章，并添加内容为选择字段 –

最近我用下面的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, 
      },

来源

2014-01-18 18:35:55 GiGi

尝试只有baseCls不能同时这样的代码会是这样

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

来源

2014-01-20 07:13:58

一般来说，你不想使用baseCls。如有疑问，请使用cls。 –

@Phil但你不需要sencha的风格.. baseCls覆盖默认的类名称。 –

是的，如果你想彻底改变用户界面，那么使用baseCls是一种可行的方式。 #emptyCanvas –

如何更改在sencha中选择字段样式

回答

相关问题