css - Jquery Mobile 按钮更小

Question

可能重复：
通过 CSS 调整按钮的大小

在 Jquery mobile中，可以使用以下命令创建按钮：

<a href="index.html" data-role="button"                  >Yes</a>

可以使用data-mini="true"创建一个迷你按钮：

<a href="index.html" data-role="button" data-mini="true">Yes</a>

我怎样才能创建一个更小的按钮？ （我知道 jquery mobile 默认没有更小的按钮）（我只需要它）

score 2 · Accepted Answer

一种方法是覆盖按钮大小的默认 css 样式并添加到您自己的 CSS 类中，然后您可以将其设置在您想要更小的按钮上：

CSS：

/* These values can be changed to preferred sizes */
.ui-mini.ui-mini-smaller .ui-btn-inner {
    font-size: 10px;
    padding: .45em 10px .4em;
}

然后像这样使用它：

<a href="index.html" data-role="button" data-mini="true" class="ui-mini-smaller">Yes</a>

请参阅此处的示例：http: //jsfiddle.net/XVJem/3/

1 回答 1