2

ほぼ100文字のアイテムを含むリストビューがありますが、全文を表示する必要があります。どうすればよいですか？

        <ul data-role="listview" data-filter="true" data-inset="true">
            <li data-filtertext="Hola" data-theme="b"><a href="" >Hola</a></li>
            <li data-filtertext="mundo"><a href="" >mundomundomundomundomundo mundo mundomundomundomundomundo  mundomundomundo  mundomundomundo mundomundomundomundomundomundomundo mundomundomundo</a></li>
            <li data-filtertext="hello"><a href="" >hello</a></li>
            <li data-filtertext="world"><a href="" >world</a></li>
        </ul>

JSFiddleコード

4

2 に答える 2

3

white-space :nowrapルールからを削除する必要があり.ui-li .ui-btn-text a.ui-link-inheritます.ui-btn-inner

またはそれをオーバーライドしますwhite-space:normal!important;

より大きなアプリケーションでは、それが副作用を引き起こす可能性があるかどうかはわかりません。

http://jsfiddle.net/gaby/eFvzC/1/でのデモ

インラインスタイルを避けたい場合は、値に基づいて要素を直接ターゲットにすることができdata-filtertextます（最新のブラウザの場合）

.ui-li[data-filtertext="mundo"] .ui-btn-text a.ui-link-inherit{
   white-space:normal!important;
}
于 2012-12-12T18:13:34.997 に答える
2

white-spaceプロパティを変更するだけで使用できます

例えば

<ul data-role="listview" data-filter="true" data-inset="true">
        <li data-filtertext="Hola" data-theme="b"><a href="" >Hola</a></li>
        <li data-filtertext="mundo"><a style="white-space: pre-wrap;" href="" >mundomundomundomundomundo mundo mundomundomundomundomundo  mundomundomundo  mundomundomundo mundomundomundomundomundomundomundo mundomundomundo</a></li>
        <li data-filtertext="hello"><a href="" >hello</a></li>
        <li data-filtertext="world"><a href="" >world</a></li>
    </ul>

もちろん、インラインスタイルの使用は避けたほうがいいでしょうし、カスタムスタイルにしたいリストアイテムにクラスを追加するだけのほうがいいでしょう...

于 2012-12-12T18:17:26.800 に答える