html - 我的 Logo 不会出现在页眉上，正确的文件路径是什么？

Question

//HTML

<div class="logo">
            <img src="OneDrive/sublime/logo.png" alt="hi">
        </div>
    <div class="row">
        <ul class="main-nav">
            <ul>
                <li class="active"><a href="index.html">HOME</a></li>
                <li><a href="#">ABOUT</a></li>
                <li><a href="#">CONTACT</a></li>
                <li><a href="#">STUDY</a></li>
                <li><a href="#">SERVICE</a></li>
                <li><a href="blog.html">BLOG</a></li>
            </ul>
        </ul>
    </div>

//CSS

.logo   {
width: 150px;
height: auto;
float: left;
margin: 20px;
background: url('logo.png');
          }

我将我的图像放在 OneDrive 上一个名为 sublime 的文件夹中，然后将 Logo 放在该文件夹中。我使用的是 Windows 10。由于某种原因，图像被裁剪了。我希望显示整个图像，而不仅仅是其中的一部分。有一个叫做 OneDrive 的东西，我创建了一个名为“sublime”的文件夹，并将 Logo 作为“logo.png”放在那里。

Answer 1

去除背景:url('logo.png');在CSS里面。也可以在 css 中尝试 object-fit: contain;