sencha 中的按钮背景颜色答案

【问题标题】：Button background color in senchasencha 中的按钮背景颜色
【发布时间】：2012-04-05 06:29:55
【问题描述】：

我是煎茶触摸的新手。我们如何将按钮的背景颜色更改为白色？我有一个按钮，每个角落都有两个图像。我希望按钮是纯白色的。我尝试像这样使用 css：

.quest {
background: url(../images/quest.jpg) no-repeat left,
       url(../images/rightarrow.jpg) no-repeat right;
       background-color: white;
       border: none;
       border-color:white;
       padding-left: 50px;
       text-align: left;
}

我的按钮在这里：

{
    xtype: 'button',
    text: '<div class="quest">Info</div>',
    labelWidth: '100%',
    name: '',
    handler: function() {                 
    }
}

我的按钮有灰色边框（sencha 中的默认按钮颜色为灰色），中间为白色。我如何使它完全变白？请帮忙。

我什至尝试过：

style: "background-color: white"

【问题讨论】：

标签： css sencha-touch

【解决方案1】：

使用 'cls' 属性解决了我的问题。

               {

                   xtype: 'button',
                   cls: 'btn',
                   text: '<div class="person">People</div>',
                   labelWidth: '100%',


                },

在我的 app.css 中定义

.btn
{
background-color: white !important;
background-image: none;
}

我们必须重新定义 background-color 和 background-image 属性，以便覆盖默认的 sencha-touch.css 属性。感谢 Thiem Nguyen 的帮助。

【讨论】：

干得好！！唯一的事情是我们失去了pressed-cls的感觉。知道如何添加它吗？

【解决方案2】：

这应该会呈现您想要的按钮:)

config: {
        ui: 'plain',
        text: 'Your Text',
        style: 'background-color:white;'
    }

【讨论】：

谢谢。但我已经提到我也使用过。它不工作。
你试过ui: 'plain'了吗？我刚刚尝试使用这些配置创建一个按钮，并且效果很好
{ xtype: 'button', config: { ui: 'plain', text: 'Your Text', style: 'background-color:white;' } } 我试过这样。
您是否说您希望按钮为纯白色？那么它是什么样子的呢？
这很奇怪。让我们在网上查一下。请转到 sencha touch 2 文档，并找到 Ext.Panel。这是那里的实时代码编辑器，我唯一更改的是：var button = Ext.create('Ext.Button', { text: 'Button', ui: 'plain', style: 'background-color: white; color: red;' });。你得到了什么？

【解决方案3】：

正如 Thiem Nguyen 所说，这会起作用

           {
                xtype:'button',
                text:'text',
                ui:'plain',
                style:'background-color:white'
            }

【讨论】：