Question

我正在开发一个JQuery Mobile应用程序。我需要放大用于标题文本的字体。每当我放大文本大小时，ui-header条的高度都会增加。我不希望它成长。相反，我希望ui-header保持与默认ui-header相同的大小。我只是想扩大文字大小。目前，我有以下内容：

.t1 { color: blue; font-size:24pt; font-weight:normal; }
.t2 { color: white; font-size:24pt; font-weight:normal; }

<div data-role="header" data-position="fixed">
  <a href="#" data-icon="arrow-l" data-direction="reverse" data-iconpos="notext" class="ui-btn-left jqm-home dd-btn">Back</a>
  <h1><span class="t1">My</span><span class="t2">App</span></h1>
</div>

如何在不增加标题的情况下更改字体大小？

Answer 1

您还必须修改.ui-header .ui-title规则更改顶部和底部边距值。例如：

.ui-header .ui-title {
    margin: 0 30% 0;
}

http://jsfiddle.net/Pwqtm/1/

自定义JQuery Mobile App默认主题中的标题

1 个答案: