0

我正在使用 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/

干杯

4

1 回答 1

1

jQuery Mobile 应用额外的标记来样式化 jQuery Mobile 应用程序中使用的所有小部件。这意味着在应用了所有样式后，按钮并不是您实际看到的。查看 jsfiddle 的源代码，您应该能够看到您的按钮实际上已包装在一个 div 中，该 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;
}

小提琴

于 2013-09-25T06:52:46.663 回答