customizing button icon issue

1)I was trying to customize arrow icon as in this img. I sliced the img and saved with alpha transparency in .png format arrow img. But didn't displ开发者_运维百科ay that way. Here is my code

2)When I click the btn its active color is blue. How to change that? I tried changing .ui-btn-active. Didn't seem to work.

1. Not sure, I'll look into it.

2. It is .ui-btn-active. You need to change both the background property and change the gradient of the background-image. Like this (though this is for orange, you need to specify your shades of the gradient):

   .ui-btn-active {
       background: #F08801;
       background-image: -moz-linear-gradient(top, #F08801, #B85000);
       background-image: -webkit-gradient(linear,left top,left bottom, color-stop(0, #F08801), color-stop(1, #B85000));
    }