4

ヘッダーのロゴをクリックしてホームページにリンクしたいのですが、これを正しく行う方法が正確にはわかりません。

私のコード:

ナビゲーション メニュー:

HTML

<div id="myMenu">
            <div class="myWrapper">
                <nav>
                    <div class="logo"></div>
                </nav>
            </div>
        </div>

CSS

#myMenu
{
    width: 100%;
    height: 30px;
    z-index: 999; 
    background-color: #252e30;

}
.myWrapper
{
    max-width: 660px;
    margin: 0 auto;
}

.logo
{
    display: inline-block;
    width: 156px;
    height: 30px;
        margin-top: 5px;
        background-size: auto 43px;
    background-image: url(../images/mylogo.png);
    background-repeat: no-repeat;
}

ロゴをクリック可能にして、ページへのリンクを作成したい: Homepage.cshtml

4

6 に答える 6

17

imgCSS を使用してロゴを背景画像として設定する代わりに、タグを使用してリンクで囲んだ場合、何が問題になるでしょうか? そのようです：

<div id="myMenu">
  <div class="myWrapper">
    <nav>
    <a href="/"><img src="../images/mylogo.png" height="30" width="156" /></a>
    </nav>
  </div>
</div>

これには、アクセシビリティが向上するという追加の利点があり (特にalt、ロゴに属性を使用する場合)、検索エンジン ボットをより満足させます。ユーザーに意味を伝える画像コンテンツは、CSS を使用して設定しないでください。

于 2013-02-08T15:12:01.627 に答える
1

アンカータグでラップされた画像を使用することをお勧めします。

しかし、そうでなければこれはうまくいくはずです:

<div class="logo" onclick="window.location.href='homepage.html'"></div>
于 2013-02-08T15:11:16.323 に答える
0 
<div id="myMenu">
         <div class="myWrapper">
             <nav>
                 <a href="Homepage.cshtml"><div class="logo"></div></a>
             </nav>
         </div>
    </div>
于 2013-02-08T15:12:33.920 に答える
0

背景画像をリンクにすることはできません。画像を HTML コードに移動し、それをリンクにします。

于 2013-02-08T15:11:54.707 に答える
-1

ロゴには の<a>代わりに を使用してください。<div>

于 2013-02-08T15:10:36.400 に答える