2

私は固定トップナビゲーションバーを持っています。デスクトップの場合はすべて問題ありません。しかし、携帯電話でリンクやボタンをクリックするのは難しいです。

ユーザーは緑色の領域をクリックできません:

ここに画像の説明を入力

ナビゲーションバーのスタックとトグルボタンを簡単にクリックできるようにすることは可能ですか、または簡単に実装できますか? たとえば、ユーザーは次のように 3 つのセクションのそれぞれをクリックできます。ここに画像の説明を入力

私のコードとフィドルは以下の通りです: http://jsfiddle.net/mavent/RaArC/11/

<nav class="navbar navbar-inverse navbar-fixed-top visible-xs" role="navigation">
    <div class="navbar-header" style="text-align:center;">
        <button type="button" class="navbar-toggle pull-left" data-toggle="collapse" data-target=".navbar-part2"> <span class="sr-only">Toggle navigation</span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>
        </button>
        <button type="button" class="navbar-toggle pull-right" data-toggle="collapse" data-target=".navbar-part3" style="padding: 3px 15px;">
            <img src="http://www.wdc.com/Global/images/icons/icon_supporthelp.gif" width="24" height="24" alt="aaaa">
        </button>
        <div style="padding-top: 15px;"> <a href="/page0" title="aaa" style="color:#ffffff;margin-top:40px;">Example.com</a>
        </div>
    </div>

    <div class="collapse navbar-collapse navbar-part2">
        <ul class="nav navbar-nav">
            <li><a href="/page1">page 1</a></li>
            <li><a href="/page2">page 2</a></li>
        </ul>
    </div>
    <div class="collapse navbar-collapse navbar-part3">
        <ul class="nav navbar-nav">
            <li><a href="/page3">page 3</a></li>
            <li><a href="/page4">page 4</a></li>
        </ul>
    </div>
</nav>

（回答のない同様の質問はこちら）

4

2 に答える 2

0

これはあなたが探しているものですか？

http://jsfiddle.net/RaArC/14/

「Example.com」リンクのスタイルを「display:block」に変更し、周囲を削除しました<div>(リンク ブロック自体に組み込んだパディングのみを提供していました)。

<a href="/page0" title="aaa" style="color:#fff;padding:15px 0px;display:block;">Example.com</a>
于 2013-11-01T12:01:55.583 に答える
0

このようにdivを作成します

このようにdivを作成します。幅: 10%; および幅: 80%;

これらのパーセンテージは必要に応じて変更できます。次にfloat: left; を使用します。divを配置します。

div の画像は中央に配置する必要があります。背景位置は中央中央でなければなりません

お役に立てば幸いです。

于 2013-10-31T21:49:12.407 に答える