如何去掉列表的上边框？

gundumw100

仔细看列表的最上面的边框，似乎有一条1px的分割线，如何去掉它？
我已经把所有可能的边框粗细都设成0了，可还是有这样的分割线存在。

1. <div><ul data-role="listview" data-inset="true" data-count-theme="a"></div><div><span class="Apple-tab-span" style="white-space:pre">        </span>  <li data-icon="arrow" data-iconshadow="false"><a style="padding:16px;" href="#">App Version<span id="appVersion" class="ui-li-count"></span></a></li></div><div><span class="Apple-tab-span" style="white-space:pre">        </span>  <li data-icon="arrow" data-iconshadow="false"><a style="padding:16px;" href="" >About us</a></li></div><div><span style="line-height: 1.5;"></ul></span></div>

复制代码

gundumw100

原来需要修改.ui-li,将border-top-width: 1px;改成需要的粗细就可以了。
这条线不是li的，而是div的，JQM在生成的时候将ul里的li元素外面再套两个div元素，这条线就是div中产生的，难怪我怎么调li都没什么效果。
.ui-li{
        margin: 0;
        overflow: visible;
        text-align: left;
        border-width: 0;
        border-top-width: 0px;
        border-bottom-width: 0px;/*我添的*/
}

这也太坑人了，为什么JQM在li外面还要再生成2个div呢？这样层层嵌套，就不考虑效率？

admin

gundumw100 发表于 2014-6-24 21:20
在使用元素的时候，JQM会默认在之间加一条分割线，如何去掉默认的分割线，或者修改它的粗细？ ...

改css 火狐firebug 调试工具 或者谷歌调试工具试试

gundumw100

1. <ul data-role="listview" data-inset="true" data-count-theme="a">
   
2.      <li data-icon="arrow" data-iconshadow="false"><a style="padding:16px;" href="#">App Version<span id="appVersion" class="ui-li-count"></span></a></li>
   
3.      <li data-icon="arrow" data-iconshadow="false"><a style="padding:16px;" href="" >About us</a></li>
   
4. </ul>

复制代码

在使用<li>元素的时候，JQM会默认在<li>之间加一条分割线，如何去掉默认的分割线，或者修改它的粗细？

admin

你的代码成乱码了，这个用工具调调 看看到底是那个元素出现的边框，对症下药