Question

请检查以下代码。

我的图片没有显示在菜单栏上。（经过很长时间后使用css :)）

HTML：

<html>
    <head>
        <link href="style.css" rel="stylesheet" type="text/css"/>
    </head>
    <body>
        <div id="navigation-container">
            <div class="rectangle">
                <div class="logo"/>
            </div>
        </div>
    </body>
</html>

CSS：

#navigation-container {
    margin: 0 auto;
    width: 1050px;
}

.rectangle {
    background: black;
    position: relative;
    height: 62px;
    -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.55);
    box-shadow: 0px 0px 4px rgba(0,0,0,0.55);
    -webkit-border-radius: 3px;
    margin-top:0em;
}

.logo {
    background:url('company_logo.png');
}

提前致谢

Answer 1

您需要为.logo设置高度和宽度。 See this JSFiddle

请注意，<div>无法自动关闭，您必须拥有</div>。 <div/>无效HTML。

Answer 2

id =＃ class =。

您需要更新自己的css，使其显示.logo，而不是#logo。

此外，您的HTML应为<div class="logo"></div>。

另外，由于您没有指定.logo的高度，这不起作用，我建议您将其更改为： <div class="rectangle logo"></div>

为什么我的徽标显示在菜单栏中？

2 个答案: