jQuery mobile:在ListViews中启用Word Wrap

Ian*_*ink 9 css jquery whitespace word-wrap jquery-mobile

我有一个listview(见下图),我想用自动换行包装所有内容而不是添加...到长行.

这是怎么做到的?

在此输入图像描述

Jas*_*per 21

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

?.ui-page .ui-content .ui-listview .ui-li-desc {
    white-space : normal;
}?
Run Code Online (Sandbox Code Playgroud)

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

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

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

<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>
Run Code Online (Sandbox Code Playgroud)


小智 5

我的建议是在其中使用Div <li>并设置您想要的特定行为,而不是更改jquery mobile css的整体行为.有了这个,你只能按照你想要的方式行事.