时间戳

首页 > 解决方案 > 调整徽标图像的大小

html - 调整徽标图像的大小

问题描述

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

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

标签： htmlcssimageresize

解决方案

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>

推荐阅读