2

我有一个包含 jQuery-mobile 的自定义模板。问题是大多数按钮都在data-role="controlgroup"- 这很好,因为它还调整元素大小和居中,但现在我有一个表格,我需要在其中使用一些按钮,因此 jQuery mobile 尝试在一组中显示它圆角。

<div data-role="fieldcontain">
    <fieldset data-role="controlgroup">
        <table>
            <tr><td></td><td>Name</td><td></td></tr>
            <tr><td>1</td><td>ADS</td><td><a href="#" data-role="button" data-ajax="false">Run</a></td></tr>
            <tr><td>2</td><td>ASDF</td><td><a href="#" data-role="button" data-ajax="false">Run</a></td></tr>
            <tr><td>3</td><td>ASD</td><td><a href="#" data-role="button" data-ajax="false">Run</a></td></tr>
            <tr><td>4</td><td>ASDF</td><td><a href="#" data-role="button" data-ajax="false">Run</a></td></tr>
        </table>
    </fieldset>
</div>

角落

那么是否可以data-role="controlgroup"在表格中使用而不显示圆角或显示每个圆角?

4

1 回答 1

0

您需要为表格列中的控件组中的按钮编写自己的 CSS 规则。您还需要将这些规则放在原始的jQuery Mobile CSS 定义之后(即在jquery-mobile.css您自己的 CSS 文件的末尾或包含在 jQuery Mobile 之后)。这些方面的东西:

table td .ui-controlgroup-controls .ui-corner-top, table td .ui-controlgroup-controls .ui-corner-bottom {
        -moz-border-radius: .6em /*{global-radii-blocks}*/;
        -webkit-border-radius: .6em /*{global-radii-blocks}*/;
        border-radius: .6em /*{global-radii-blocks}*/;
        -moz-border-radius: .6em /*{global-radii-blocks}*/;
        -webkit-border-radius: .6em /*{global-radii-blocks}*/;
        border-radius: .6em /*{global-radii-blocks}*/;
}
于 2012-10-16T08:28:39.487 回答