通过CSS更改JQuery Mobile的字体和颜色

Question

在这个问题中，我不会让用户控制我的JQuery列表中的颜色或字体类型。

我想知道是否有一种方法（不应用全新的主题）来改变JQuery列表的字体颜色。目前使用的是默认主题。

该类名为： ui-content

我已尝试将此CSS应用于页面，但该页面仍然看起来像默认的JQuery主题：

  .ui-content{
      font: "Helvetica Neue-Light", Helvetica, Arial, sans-serif;
      color:#A25254;
  }

以下是其中一个列表视图的行不更改字体或颜色的示例：

我希望字体 light ，而不是粗体。我还希望能够更改表格左侧的图标。

以下是表格构建方式的示例代码：

<div data-role="page" id="page1">
  <div data-role="header">
    <h1>jQuery Mobile Example</h1>
  </div>
  <div role="main" class="ui-content" data-filter="true">
  <!--Begining of Table View-->
    <div data-role="collapsible" data-inset="false">
      <h3>Title</h3>
      <p>Description</p>
    </div>
  </div>
</div>

这是我想要做的JSFiddle：http://jsfiddle.net/jakechasan/M7LLU/

Answer 1

有很少的选择。首先，您应该使用id。 <div role="main" class="ui-content" data-filter="true" id="Something">

因此Css将如下所示：

#Something{
    font: "Helvetica Neue-Light", Helvetica, Arial, sans-serif;
    color:#A25254;
}

另一个选择是“检查”您的div并找出您的div的班级。

您会发现类似.ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper的内容 粗体字是（我在google chrome上检查过。如果是粗体字，则应该写一个） 如果粗体为：.ui-panel-wrapper
示例：

.ui-panel-wrapper .ui-content{
    yourCss:ishere;
}