Question

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

我希望能够调整我的徽标图像的大小并使其居中（当前在预览时占据整个页面），但我尝试了许多不同的 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%;
}

Answer 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>

调整徽标图像的大小

1 个答案: