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而不是按钮

并将你改为

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

Fiddle

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

1 个答案: