0

私のヘッダーテキストは次のようになります。

My Hea....

読んでもらいたい

My HeaderHereTodayAndIsTooLong

このレンダリングを正しく行うには、jquery モバイル フレームワーク/css で何を変更する必要がありますか?

   <div data-role="header"  data-position="fixed" data-tap-toggle="false">
     <h2>My HeaderHereTodayAndIsTooLong</h2>
      <a href="@Url.Action("Index","Home", new { partnumber = ViewBag.PartNumber })" class="ui-btn-right" data-icon="info">Home</a>
     </div>
4

2 に答える 2

1

h2 タグを div で囲みます。テキストを中央に表示したい場合は、作成したコンテナ div に text-align スタイルを追加します。

<div data-role="header" data-position="fixed" data-tap-toggle="false">
    <div style="text-align:center;">
        <h2>My HeaderHereTodayAndIsTooLong</h2>
    </div>
</div>

編集:ボタンを右側に表示するには、テキストの配置を削除し、ヘッダーにいくつかのスタイルを適用して、希望どおりに配置します。大まかな例:

<div data-role="header"  data-position="fixed" data-tap-toggle="false">
    <div>
        <h2 style="font-size:0.8em;margin-left:10px;width:70%;">My Header Here Today And Is Too Long</h2>
    </div>
    <a href="@Url.Action("Index","Home", new { partnumber = ViewBag.PartNumber })" class="ui-btn-right" data-icon="info">Home</a>
</div>
于 2012-07-25T14:54:07.373 に答える
1

JQM が に追加するマージン スタイルをオーバーライドすることもできますがhx、もちろん、それによってスペースが少し増えるだけです。最終的には、ヘッダー テキストが長すぎる場合でもオーバーフローします (もちろん、これらのスタイルをオーバーライドできます)。例えば

.lrMarg0
    {
        margin-left:0px !important;
        margin-right:0px !important;
    }


     <div data-role="header" data-position="fixed" data-tap-toggle="false">
        <h2 class="lrMarg0">My HeaderHereTodayAndIsTooLong</h2>
        <a href="#"  class="ui-btn-right" data-icon="gear" data-role="button">Next</a>
      </div>
于 2012-07-25T15:33:09.440 に答える