jquery - 导航栏选项卡的自定义主题/颜色jquery-mobile

Question

美好的一天!

我正在使用 jquery-mobile 1.4.3 并尝试将导航栏选项卡更改为自定义颜色。我尝试使用 theme-roller 并从以下位置修改色板:

http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.css

我所做的是获取上面的文件，制作一个本地副本，并将样本 A 的所有出现的“背景颜色”更改为黄绿色(这不是我想要的颜色，只是为了测试)。然后我在数据中使用它-主题如下:

<div role="navigation" class="ui-navbar ui-mini" data-role="navbar">
  <ul class="ui-grid-duo ui-grid-a">
    ....
    <li class="fareTabTop ui-block-a"><a class="ui-link ui-btn ui-btn-a" data-theme="a"  href=""  onclick="showDetails()">1268.00</a></li>
    ...
  </ul>
</div>

但它不是这样工作的。

这是我如何引用自定义 CSS 的 index.html 文件的片段:

<link rel="stylesheet" href="css/mycustom.css" type="text/css">
<!-- link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.css" / -->
<link rel="stylesheet" href="css/jquery-mobile-1.4.3.css">

所以我将 jquery-mobile-1.4.3.css 更改为 Swatch A 的“yellogreen”背景。

<script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.js"></script>

我尝试使用 theme-roller，但也没有用。

我的目标是简单地让 1268.00 和 3114.00 的导航栏选项卡具有不同的颜色。只有内置主题“b”在工作(更改为黑色)但没有其他工作。

有人可以帮我找到解决这个问题的方法吗？

谢谢，维克多。

Answer 1

我已经解决了如下问题:

1) 使用 theme-roller 将按钮颜色更改为我想要的颜色 theme roller 会为其生成 CSS。我称我的主题为“F”。 重要:theme-roller 中的主题字母必须与我在代码中指定的数据主题匹配。我的问题是，在 theme-roller 中，我在“A”下使用主题，但调用(并引用)创建了 CSS 文件作为主题“F”(对我来说这是一个大问题)。很明显存在差异。 2) 将生成的主题“F”(在 theme-roller 中匹配)放置到 mycustom.css 文件中，现在我可以为我的选项卡使用我想要的任何颜色 :)