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