jQuery mobile:在ListViews中启用Word Wrap

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

这是怎么做到的?

在此处输入图像描述

您只需更新包含list-item中文本的.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的示例列表项:

 
  • Sample Title

    Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content

  • 我的建议是在

  • 使用Div并设置你想要的特定行为,而不是改变jquery mobile css的整体行为。 有了这个,你只能按照自己想要的方式行事。

    li部分里面添加一个div其中style="white-space:normal;" 强迫自动换行的部分。

    在jQuery mobile 1.4.4中,这有效:

     .ui-listview > li p { white-space: normal; }