0

ナビゲーション メニュー内のヘッダーに画像を配置しようとすると問題が発生します。理想的には、すべてを下に揃える必要があります。問題を再現するためにjsfiddleを作成しました：

http://jsfiddle.net/graphicsxp/j2t9R/

        <nav style="float: left">
            <ul class="menu">
                <li>
                    <a href="index.html" class="logo">
                        <img src="img/logo.png" alt="" class="brand logo_def" width="125" height="39" /></a>
                </li>
                <li>
                    <h4 >Sam</h4>
                </li>
            </ul>
            <div class="clear"></div>

        </nav>
        <nav>
            <ul class="menu">
                <li class="current-menu-parent"><a href="javascript:void(0)">ACCUEIL</a>

                </li>
                <li><a href="javascript:void(0)">PAGES</a>

                </li>                   
            </ul>
            <!-- .menu -->
            <div class="clear"></div>
        </nav>
    </div>
</header>

そのまま：

現在の状態

することが：

することが

4

2 に答える 2

2

私はあなたのコードを使用して問題を解決しましたが、正直なところ、このような単純なタスクのために多くのコードが実行されているため、何を変更したかを伝えることができませんでした. ここはとにかく

また、自由に新しいコードを作成して、コードがどれほどシンプルに見えるかを示しました

シンプル、クリーン、読みやすい。すべて 1 つ<div>の と順序付けられていないリストで完了します。

コードを簡素化して読みやすくすることは、コーディングの第一の目標であるべきですが、それはユーザーが質問にすばやく簡単に答えられるようにし、質問をより適切に解決するのにも役立ちます。

于 2013-07-30T09:06:46.953 に答える
0

一時的な修正は次のようになります。

h4 要素の css を追加します.... id を指定してから追加することをお勧めします。

私はあなたのフィドルを見ました、あなたのcssに以下のコードを入れてください

h4{
    margin-top:150px;
}

また

(samのh4にid=hompageheaderUserNameを付与)

h4#hompageheaderUserName
{
    margin-top:150px;
}

幅のエアコンを必要に応じて変更します。

フィドルからのスクリーンショット:

ここに画像の説明を入力

于 2013-07-30T08:53:32.623 に答える