css - 在Listview中缩小列表项的高度

Question

我正在创建一个可折叠的列表视图，标记如下。我希望能够缩小列表项的高度，目前我只能在移动屏幕上放几个。

<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>

Answer 1

好吧，您可以覆盖margin,padding和 afont-size如果您想要一些 jQM 样式

.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示例