如何删除底部列表视图行分隔符JQM 1.4.5

时间:2016-04-28 07:20:21

标签: css jquery-mobile

我正试图摆脱底部的listview行分隔符。我使用的css在jQM 1.3.2中运行良好,但在1.4.4中,它可以从列表中删除除底部之外的所有分隔符。原始解决方案来自此处:earlier solution

我有4个项目列表:

<ul data-role="listview"  data-corners="false"  id="indexList">
  <li><a href="#">item 1</a></li>
  <li><a href="#">item 2</a></li>
  <li><a href="#">item 3</a></li>
  <li><a href="#">item 4</a></li><br>
</ul>

CSS应用于列表:

 #indexList.ui-listview li {
    width: 85% !important;
    margin: 3% !important;
    padding-bottom:1%;
    float: left;
    border: 1px solid #ccc !important;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.25);
    background: rgba(0,0,102,.85) !important; 
    font-weight:500 !important;
    text-shadow:none !important;
}

CSS删除列表视图分隔线:

.ui-btn-inner
{
    border-width: 0px;
}

我也试过border-bottom: none;

TIA提供任何帮助。

1 个答案:

答案 0 :(得分:1)

将边框添加到锚标记,因此代码将如下所示。

.ui-listview li a.ui-btn{
    border: none;
}