Remove line separator of listview jquery mobile

删除回忆录丶 提交于 2019-12-12 05:39:58

问题


I am using a listview of Jquery mobile and I want to remove the line separator of each list item in my css. How can I do this? Thank you.

<ul data-role="listview" class="panel-list" data-icon="false">
            <li>
                <a href="#" data-t="lateral_menu_option1" onclick="$('.main-panel').panel('close')" class="main-panel-menu-opt">
                    <div class="panel-images-div"><img src="../img/img.png" class="panel-images"></div>
                </a>
            </li>
            <li>
                <a href="#" data-t="lateral_menu_option2" onclick="$('.main-panel').panel('close')" class="main-panel-menu-opt">
                    <div class="panel-images-div"><img src="../img/img.png" class="panel-images"></div>
                </a>
            </li>
            <li>
                <a href="#" data-t="lateral_menu_option3" data-t="lateral_menu_option2" onclick="$('.main-panel').panel('close')" class="main-panel-menu-opt">
                    <div class="panel-images-div"><img src="../img/img.png" class="panel-images"></div>
                </a>
            </li>
            <li>
                <a href="#" data-t="lateral_menu_option4" onclick="$('.main-panel').panel('close')" class="main-panel-menu-opt">
                    <div class="panel-images-div"><img src="../img/img.png" class="panel-images"></div>
                </a>
            </li>
            <li>
                <a href="#" data-t="lateral_menu_option5" onclick="$('.main-panel').panel('close')" class="main-panel-menu-opt">
                    <div class="panel-images-div"><img src="../img/img.png" class="panel-images"></div>
                </a>
            </li>
            <li>
                <a href="#" data-t="lateral_menu_option6" onclick="localStorage.setItem('languagegiza', ''); $('.main-panel').panel('close')" class="main-panel-menu-opt">
                    <div class="panel-images-div"><img src="../img/img.png" class="panel-images"></div>
                </a>
            </li>
        </ul>
    </div><!-- /panel -->


回答1:


simply add in your css:

.ui-btn-up-c { border:0px;}



回答2:


To remove Line Separator of List View, you can add this style in CSS.

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

It works for me.




回答3:


I have done this and just wrote in my css file:

#listview-main .ui-btn {border:0px}

Using jQuery 1.11.2 + jQuery Mobile 1.4.5
Note the id selector for listview... this code does not worked without that.



来源:https://stackoverflow.com/questions/22832220/remove-line-separator-of-listview-jquery-mobile

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!