0

私はhtmlとjavascriptを使用してアプリケーションを開発しています。1つのページにui-scrolllistviewがあり、正常に入力されています。ただし、単語がリストビューに対して大きすぎる場合は、単語の幅が拡張されるだけなので、画面から消えます。

ui-scrolllistview内の単語またはワードラップ単語の長さを設定して、ui-scrolllistviewの右の境界線が途切れないようにする方法はありますか？

ありがとう

編集

これがui-scrolllistでページを作成している私のコードです

<div data-role="page" data-theme="f" id="choose-building">

    <div data-role="header" data-theme="f" data-position="fixed"  data-tap-toggle="false">
    <h1><img src="images/building.png" height="80px"></h1>
        <div data-role="controlgroup" class="ui-btn-right topzero">
        <a href="#" data-rel="back"  data-role="button" data-inline="true"  data-direction="reverse">Back</a>
        <a id="applyFilter" data-role="button" data-inline="true" onClick="pickedBuildings();">Chosen Buildings</a>
        </div>
    </div>

    <div data-role="content" data-scroll="Y" class="ui-scrolllistview" >
        <form>

        <div data-role="fieldcontain">          

            <fieldset data-role="controlgroup" id="CatagoryChooseBuilding" >
            </fieldset>

        </div>
        </form>
    </div>
    <div data-role="footer" data-theme="f" data-position="inline" data-id="main-footer"  data-tap-toggle="false">
        <div data-role="navbar" >
        <ul>
            <li><a href="#home" data-role="button" data-icon="myapp-home" >Home</a></li>
            <li><a href="#page-map" data-role="button" data-icon="myapp-building-a" >Buildings</a></li>
            <li><a href="#more" data-role="button" data-icon="myapp-more" >More</a></li>
        </ul>
        </div><!-- /navbar -->
    </div><!-- /footer -->  
</div>
4

1 に答える 1

0

私はあなたが探しているように聞こえると思いますtext-overflowそしてwhite-spaceそしておそらくoverflow。

これらのさまざまなCSSプロパティを使用して、とを設定した後、気になる寸法でテキストを停止できます。marginspadding

text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;

編集：例

テキストをスクロールバーから好きなだけ遠ざけるまで、余白のプロパティを調整できます。

編集：フレームワーク（タグに応じてjQuery mobile）がテキストを含む最も内側の要素でそれを切り捨てるワードラップを許可する場合はoverflow: visible;、white-space:normal;

期待どおりの動作の変化が見られない場合は、開発ツールウィンドウからページを表示してください。これらはChromeとIEに組み込まれており、Firefox用のFirebugを使用できます。これらを使用すると、スタイルシートの変更を「オンザフライ」でテストできます。これは、期待する動作を実現するために必要なもののように聞こえます。

于 2012-04-19T11:49:13.787 に答える