html - 将我的 Logo 链接到主页 html

Question

我想让我的标题中的 Logo 可点击并链接到主页，但我不知道如何正确地做到这一点。

我的代码:

导航菜单:

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;
}

我希望我的 Logo 可点击并链接到页面:Homepage.cshtml

Answer 1

与其使用 CSS 将您的 Logo 设置为背景图片，不如使用 img 标签(由链接包围)会有什么问题？像这样:

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

这具有更易于访问的额外好处(特别是如果您在 Logo 上使用 alt 属性)，这会使搜索引擎机器人更快乐。向用户传达意义的图像内容绝不应使用 CSS 进行设置。