html - 图片不显示

Question

正如标题所说，我对图片有疑问。我已经设置了大小并将其正确链接到一个单独的文件夹。可能是什么问题？

我对“页眉”背景没有任何问题。

#logo{
    height: 200px;
    width: 200px;
    background: url(bilder/GC-logo.psd);
}

Header{
    height: 100vh;
    background: url(bilder/sweden-853150.jpg);
    background-size: cover;
}

.logo{
    display: flex; 
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 260px;
    width:260px;
    border: 1px solid green;
    float: left;
    margin: 0;
}

    <Header>
        <div class="logo">
            <img id="logo" />
        </div>
        <nav>
            <ul>
                <li><a href="">asdasdasd</a></li>
                <li><a href="">asdasdd</a></li>
                <li><a href="">zxczxczxc</a></li>
                <li><a href="index.html">Hem</a></li>
        </nav>
        <div class="container" id="easy_nav">
            <div class="centered-text">
                <a href="index.map.html"><h2>something</h2></a>
                <a href="#"><h2>something</h2></a>
            </div>
        </div>
    </header>

Answer 1

Logo 图像未显示，因为您尝试使用 PSD 文件。

在 Photoshop 中打开 PSD，然后单击文件 -> 保存为 web。

这将允许您将图像导出为 jpg 或 png。单击保存并确保导出的图像位于您的 bilder 文件夹中，并更改 Logo 背景的 css 以使用新图像。