jquery - 在运行时更改 jQuery Mobile 按钮的字体大小

Question

jQuery Mobile 1.1.1 改变了按钮的形成方式。以前，我可以像这样设置按钮的字体大小：

<div id="Button1" data-role='button' data-inline=true data-theme=c 
 data-icon=false data-iconpos=none style="font-size:12px;">Button</div>

字体大小属性在 1.1.1 中被忽略。它使用默认字体大小（16px？）绘制。我可以通过添加这行代码来更改字体大小：

$('#Button1').children().children().css('font-size','12px');

但现在文本的垂直对齐已关闭：它与原始字体大小文本的下边界对齐。

有任何想法吗？

score 1 · Accepted Answer

这设置字体大小：

$('#Button1').children().children().css('font-size','12px')

要使文本居中，您还需要更改填充：

$('#Button1').children().css('padding','6px')

（使用 jQuery Mobile 1.2 测试）

score 0 · Accepted Answer

我认为字体大小的冲突可能与 jQuery Mobile 1.1.1 设置的任何行高有关。这会解决它吗？

$('#Button1').children().children().css('font-size','12px').css('line-height','12px');

编辑- 尝试在 CSS 中为 #Button 元素的所有子元素设置 line-height：

#Button1 *
{
    font-size:12px !important;
    line-height:12px !important;
}

score 0 · Accepted Answer

到目前为止我发现的另一个解决方案是添加 { padding: 5px; } 用于特定按钮。这有效，文本垂直对齐，但按钮文本周围出现第二层。不知道如何摆脱它。

3 回答 3