jQ移动更改特定按钮的边框半径

Question

我正在使用jQMobile，并且想要更改按钮的边框半径，完全是一个按钮，而不是整个类应用于按钮，这甚至有可能吗？

下面的代码的一部分：

<!-- language: html --> 
<div class="ui-grid-b"> 
    <div class="ui-block-a"> 
    <button type="submit" data-theme="a" class="ui-btn-hidden flight-type-btn-1" data-disabled="false" data-mini="true">Return</button> 
    </div> 
    <div class="ui-block-b"> 
    <button type="submit" data-theme="a" class="ui-btn-hidden flight-type-btn-2" data-disabled="false" data-mini="true">One Way</button> 
    </div> 
</div> 

和CSS：

.flight-type-btn-2 { 
    border-radius: 5px; 
} 

，并与样品最后一个的jsfiddle：http://jsfiddle.net/juaning/rUBqm/

干杯

Answer 1

jQuery Mobile的应用额外的标记来风格化jQuery Mobile应用程序中使用的所有小部件阳离子。这意味着该按钮不是您在应用所有样式时实际看到的。看看你的jsfiddle的源代码，你应该能够看到你的按钮实际上被包装在一个div中，这是控制你看到的“按钮”的东西。

您的标记改为

<div class="ui-grid-b"> 
    <div class="ui-block-a flight-type-btn-1"> 
     <button type="submit" data-theme="a" class="ui-btn-hidden " data-disabled="false" data-mini="true">Return</button> 
    </div> 
    <div class="ui-block-b"> 
     <button type="submit" data-theme="a" class="ui-btn-hidden flight-type-btn-2" data-disabled="false" data-mini="true">One Way</button> 
    </div> 
</div> 

添加类到div而非按钮

，并改变你的CSS

.flight-type-btn-1 div { 
    border-radius: 8px; 
} 

Fiddle