jQuery 手机 : Enable Word Wrap in ListViews

Question

我有一个 ListView (见下图)，我想将所有内容自动换行，而不是将 ... 添加到长行中。

这是怎么做到的？

Answer 1

您只需要更新包含列表项中文本的 .ui-li-desc 元素的 CSS:

​.ui-page .ui-content .ui-listview .ui-li-desc {
    white-space : normal;
}​

这是一个演示:http://jsfiddle.net/Xc6PJ/

white-space 的一些很好的文档:https://developer.mozilla.org/en/CSS/white-space

这是在 jQuery Mobile 初始化后我的测试 listview 中的示例列表项:

<li class="ui-li ui-li-static ui-body-c">
    <h3 class="ui-li-heading">Sample Title</h3>
    <p class="ui-li-desc">
        Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content
    </p>
</li>