如何更改jquery移动列表视图1.40的背景颜色?

时间:2013-12-20 01:58:02

标签: jquery-mobile

我无法在jqm中更改列表视图中的背景...我无法将其更改为tranparent。什么是jqm类继承结构?

1 个答案:

答案 0 :(得分:1)

我遇到很多问题。有一些高级别的遗产需要克服,而且不容易找到。以下是jquery mobile 1.40的示例。这是一个允许您创建完全自定义列表视图的示例。

最棘手的是处理第一个孩子和按钮li.ui-first-child a.ui-btn的那些 - 我花了几个小时跟踪这个完成。希望这有助于其他人,因为1.40现在是最终的。

以下示例是在叠加面板上创建自定义菜单的一个非常常见的必要条件。

        <ul data-role="listview" class="primary-menu">
        <li data-icon="false">
  <a href="#product" class="ui-btn ui-nodisc-icon ui-btn-icon-left ui-icon-myicon" >
       View Products </a>
        </li>
     </ul>




    /* Menu Classes */

.ui-btn-close-panel {
    background-color:#b4316c !important;

}


ul.primary-menu {
    margin-top:10px;
    border-top:none;
}

ul.primary-menu li a{
    font-size: 1em;
    line-height: 1.3;
    color:#ffffff !important;
    font-family: 'ramblabold', Arial, sans-serif;
    background-color:transparent !important;
    border-bottom:1px solid #f2e3ea !important;
    background-image:none !important

}



ul.primary-menu.ui-listview  li.ui-first-child a.ui-btn {
    color:#ffffff !important;
    background-color:transparent !important;
    border-bottom:1px solid #f2e3ea !important;
    background-image:none !important
}


ul.primary-menu.ui-listview  li a.ui-btn {
    color:#ffffff !important;    
    background-color:transparent !important;
    border-bottom:1px solid #f2e3ea !important;
    background-image:none !important

}