【问题标题】：How to change the default font for all jQuery Mobile texts如何更改所有 jQuery Mobile 文本的默认字体
【发布时间】：2012-12-08 07:39:16
【问题描述】：

我正在尝试覆盖整个网站的 jQuery 移动默认字体。

我看到有jQuery主题滚轮，但我认为添加整个主题只是为了改变字体有点过分。

css 中是否有一个选择器可以帮助我选择所有文本然后应用我的字体？

【问题讨论】：

使用您的开发工具，在大多数现代浏览器中，您可以在页面上选择一个元素并查看哪些 CSS 规则适用于该元素，您还可以准确查看样式的哪一行-表代码可以找到。 F12 似乎是访问开发者工具的标准方式。

标签： jquery html css jquery-mobile

【解决方案1】：

这些是我目前找到的类：

.ui-body-a, .ui-body-a input, .ui-body-a select, .ui-body-a textarea, .ui-body-a button, .ui-btn-up-a,
.ui-body-b, .ui-body-b input, .ui-body-b select, .ui-body-b textarea, .ui-body-b button, .ui-btn-up-b,
.ui-body-c, .ui-body-c input, .ui-body-c select, .ui-body-c textarea, .ui-body-c button, .ui-btn-up-c,
.ui-body-d, .ui-body-d input, .ui-body-d select, .ui-body-d textarea, .ui-body-d button, .ui-btn-up-d,
.ui-dialog > *, .ui-widget input

【讨论】：

【解决方案2】：

解决方案

你可以简单地这样设置：

* {
    font: 14px Calibri,Arial !important;
}

这是一个例子：

http://jsfiddle.net/Gajotres/AzXdT/

最后的笔记

如果您想了解有关如何自定义 jQuery Mobile 页面和小部件的更多信息，请查看此 article。它附带了许多工作示例，包括为什么 !important 对于 jQuery Mobile 是必需的。

【讨论】：

这也会改变 fontawesome-like 字体

【解决方案3】：

您需要在 jquery-mobile css 文件中找到以下行并对其进行修改以指定您想要的字体。

.ui-body-a, .ui-body-a input, .ui-body-a select, .ui-body-a textarea, .ui-body-a button {
    font-family: Helvetica,Arial,sans-serif;
}

如果您使用 -b、-c 等样式，您还需要修改它们

【讨论】：

【解决方案4】：

您需要做的就是查看 jQuery Mobile CSS，找出字体当前设置的选择器，然后在您自己的 CSS 中为该选择器覆盖该值。

【讨论】：

所以没有选择器可以一次选择所有文本（包括标签、按钮等）？
@Distwo - html { ... } 将为整个页面设置字体，但您需要有一个选择器比 jQuery Mobile 选择器更具体或更具体，以覆盖其值（否则， jQuery Mobile 选择器优先）。
出于多种原因，更改 JQuery Mobile CSS 是一个非常糟糕的主意。只需创建自己的样式并覆盖 JQM 的字体。