文本字段 extjs 中的圆角

Question

我需要在 ExtJs 中更改文本字段的样式

API 文档显示这是由以下人员完成的：

{
    xtype: 'textfield',
    fieldStyle: {
        'border-radius':'7px'
    }
}

或

xtype: 'textfield',
style: {
    'border-radius':'7px'
}

None这些似乎有什么效果，谁能给点建议？

Answer 1

我设法通过添加 class 并在下面添加特定的 CSS 规则来实现这一点。最明显的方法似乎对我不起作用。

items: [{
            fieldLabel: 'First Name',
            name: 'first',
            allowBlank: false
        }, {
            fieldLabel: 'Last Name',
            name: 'last',
            allowBlank: false,
            cls: 'rounded'
        }],

<style>
   .rounded .x-form-text-wrap, .rounded .x-form-trigger-wrap {
        border-radius: 7px;
    }

</style>

这里是 Sencha Fiddle 显示它在姓氏字段上的工作。

我很想知道为什么直接添加样式或者甚至使用 fieldCls 或 baseCls 都不起作用。我会调查并 post 我得到的任何发现。

文本字段 extjs 中的圆角

Round corners in textfield extjs

css

extjs

styles

textfield