调整徽标图像的大小答案

【问题标题】：Resize logo image调整徽标图像的大小
【发布时间】：2021-09-21 05:32:45
【问题描述】：

所以我有一个可能非常愚蠢的问题，但我对编码很陌生。

我希望能够调整我的徽标图像的大小并使其居中（目前它在预览时占据了整个页面），但我尝试了许多不同的 CSS 调整方法，但什么也没发生。我错过了什么？？

除了 HTML 文件的标准开头之外，这是我的 HTML 文件中的全部内容：

<div class="header">
<img class="logo" src="images/logo.png" alt="\Stuff logo">
</div>

这些是我的 CSS 文件中仅有的几行：

body {
  margin: 0 auto;
}

.logo {
  max-width: 20%;
  max-height: 20%;
}

【问题讨论】：

如果您希望您的徽标图像位于中心，请将display: block 和margin: auto 提供给您的图像。并为调整大小给出宽度。

标签： html css image resize

【解决方案1】：

img{
     display:block;
     margin:0 auto;
     width:10%;
 }

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div class="header">
       <img src="https://images.unsplash.com/photo-1575881875475-31023242e3f9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxleHBsb3JlLWZlZWR8Mnx8fGVufDB8fHx8&w=1000&q=80" alt="">
  
     
    </div>
  </body>
</html>

【讨论】：

刚试了一下，什么都没有发生，它仍然很大，占据了整个页面。是因为它是目录中的图像吗？我只是不明白为什么它没有改变
不，不是这样的，你能把img给我吗？或者给我你下载的图片的链接。
这是一个包含在作业中的 png，我不知道如何在此处上传图片