【问题标题】：jquery mobile list divider formattingjquery移动列表分隔符格式
【发布时间】：2013-03-21 12:18:20
【问题描述】：

我正在尝试更改 jquery 移动列表视图中列表分隔符的样式，但到目前为止还没有运气。问题是我在列表分隔符内使用了一个 url，而 jquery 使它变成蓝色并带有下划线。我希望它与不是 url 时相同。

这是我添加到我的 css 以覆盖 jquery css 的内容：

   a.ui-li-divider{
      text-decoration:  none;
   }

但它什么也没做。有什么想法吗？

-- 谢谢巴特

【问题讨论】：

标签： jquery css listview jquery-mobile

【解决方案1】：

解决方案

这是一个工作示例：http://jsfiddle.net/Gajotres/kpqa5/

.ui-li-divider a {
    text-decoration:  none;
    color: black !important;
}

结语

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

【讨论】：

是的，这行得通，但奇怪的是 color=black;在这种情况下不起作用？

【解决方案2】：

我知道内联样式是一种不好的做法，但内联样式有效。

<div data-role="page" id="home">
    <div data-role="container">
        <ul data-role="listview" data-inset="true" data-divider-theme="d">
            <li data-role="list-divider"><a href="#" STYLE="text-decoration:none; color:black;">Mail</a>
            </li>
            <li><a href="#">Inbox</a>

            </li>
            <li><a href="#">Outbox</a>

            </li>
            <li data-role="list-divider"><a href="#" STYLE="text-decoration:none; color:black;">Contacts</a>
            </li>
            <li><a href="#">Friends</a>

            </li>
            <li><a href="#">Work</a>

            </li>
        </ul>
    </div>
</div>

在http://jsfiddle.net/mayooresan/LB8ZN/查看现场小提琴

【讨论】：

是的，它的风格很糟糕，但它确实有效。很好的临时解决方案。
如果@Gajotres 看到这个，他也许能给出很好的解决方案。