Button background color in sencha

问题:

I am new to sencha touch. How do we change the background color of a button to white? I have a button with two images in each corner. I want the button to be plain white. I tried using css like this:

.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; }

My button is here:

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

My button has grey borders (Grey default button color in sencha) with white color in mid. How do i make it completely white? Please help.

I have even tried:

style: "background-color: white" 

回答1:

Using 'cls' attribute solved my problem.

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

In my app.css define

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

We have to redefine both background-color and background-image properties so that the default sencha-touch.css properties are overridden. Thank you Thiem Nguyen for your help.

回答2:

Just like Thiem Nguyen said, this will work

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

回答3:

This should render your desired button :)

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

转载请标明出处:Button background color in sencha

文章来源: Button background color in sencha