7

我最近将 jQuery mobile 添加到我的网站。

然而,jQuery 主题打破了我以前的字体。虽然我的大部分页面都运行良好,尤其是漂亮的 jQuery Mobile 滑块,但我的字体确实存在问题。

我设置了自定义字体,并且在没有 jquery mobile css 的情况下它们可以正常工作。但是,一旦我包含了 jquery mobile css,它就会覆盖我的字体。

我尝试将 data-role="none" 添加到正文和 div 中,但这没有帮助。

我也尝试添加 data-theme = "none" 但这也无济于事。

有没有办法在我的页面正文上禁用 jQuery 自定义字体系列主题?

谢谢您的帮助。

4

6 回答 6

9

这是我用 Android 4.0 ICS 字体 Roboto 替换整个应用程序字体的 CSS。

  @font-face {
    font-family: 'RobotoRegular';
    src: url('../font/roboto/RobotoRegular.eot');
    src: url('../font/roboto/RobotoRegular.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto/RobotoRegular.woff') format('woff'),
         url('../font/roboto/RobotoRegular.ttf') format('truetype'),
         url('../font/roboto/RobotoRegular.svg#RobotoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
  }

  /* Android jQM Font Style Overrides */
  body  * {
    font-family: "RobotoRegular" !important;
    font-weight: normal !important;
  }

如果以上还不够,您可能还必须针对特定元素。我还必须包括以下内容:

  .ui-btn-up-a,.ui-btn-hover-a,.ui-btn-down-a,.ui-bar-a,.ui-body-a,.ui-btn-up-a,.ui-btn-hover-a,.ui-btn-down-a,.ui-body-a input,.ui-body-a select,.ui-body-a textarea,.ui-body-a$
    font-family: "RobotoRegular";
  }

我希望你来对。祝你好运。

于 2012-02-23T10:52:24.110 回答
1

我会检查元素并准确找出指定字体的位置,例如我刚刚发现这里指定了字体:

.ui-body-c, .ui-body-c input, .ui-body-c select, .ui-body-c textarea, .ui-body-c button

因此,您可以通过指定相同的选择器并显示您自己的字体来覆盖您自己的样式表:)

于 2012-02-22T22:13:18.333 回答
0

据我了解... jQuery mobile 可能只是将他自己的 css 字体发送到您的组合中。如果您有一个带有字体集的 css 文件:

通过为您的字体样式添加 !important 来尝试一些测试。

希望这将帮助您找到解决方案:)

于 2012-02-22T22:12:29.707 回答
0

感谢 agrublev 和 darryn.ten 的帮助,以下内容对我有用:

以下是更改正文和字体阴影的示例:

.ui-body-c,.ui-dialog.ui-overlay-c{
    text-shadow: 0pt 0px 0pt rgb(0, 0, 0); 
}
.ui-body-c, .ui-body-c input, .ui-body-c select, .ui-body-c textarea, .ui-body-c button{
        font-family: Helvetica, Arial, sans-serif, Verdana;
        font-size: 12px;
        text-shadow: none;
        color:black;
}
于 2012-02-24T17:41:50.007 回答
0

为 jquery mobile 创建你自己的 css 并覆盖字体系列给你自己的字体系列

于 2013-09-28T10:53:21.103 回答
0

jquery mobile 使用主题。点击http://themeroller.jquerymobile.com/

在“全局”选项卡中设置字体(对我来说:Raleway、Verdana 等),下载并安装主题就可以了。对于 jqmobile,您需要使用您的主题 css、jqm 图标和 jqm 结构来代替通常的单个 jqm css。

在 css 中覆盖的东西可能会让你在不同的浏览器中遇到不同的麻烦......这不是 jquerymobile 的重点。

于 2015-12-05T17:42:43.517 回答