在Listview中缩小列表项的高度

时间:2013-03-04 20:05:44

标签: css jquery-mobile

我正在创建一个可折叠的列表视图,下面是标记。我希望能够缩小列表项目的高度,目前我只能在移动屏幕上显示一些。

<div id="accMain0" data-role="collapsible" data-inset="true" data-collapsed="false">
    <h3>
        Travel
    </h3><div id="myAppsSectionGridTable" data-role="listview" data-inset="false">
        <li><a onclick="selectApproval(&#39;ed5895bc-0f4a-e211-a9ba-0050568e20a1&#39;,&#39;XP%2boFSgWxG0%3d&#39;,&#39;&#39;,&#39;true&#39;,&#39;false&#39;,&#39;false&#39;,&#39;true&#39;)"><img src="Images/travel.png" alt="" class="ui-li-icon" /><h3>
    Victor Chavez
        </h3><p>Try Again NAck12345</p></a></li><li>

1 个答案:

答案 0 :(得分:2)

好吧,如果你想要一些jQM样式,你可以覆盖marginpaddingfont-size

.ui-li-heading { 
    /*font-size: 16px;*/
    margin: .3em 0; 
}
.ui-li-desc { 
    /*font-size: 12px;*/
    margin: -.5em 0 .3em; 
}

.ui-li .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li {
     padding-top: .2em; 
     padding-bottom: .2em; 
}

这是jsfiddle example