Блог

Главная - Вопросы по программированию - Измените размер изображения логотипа

Измените размер изображения логотипа

#html #css #image #resize

Вопрос:

Так что у меня, вероятно, действительно глупый вопрос, но я очень новичок в кодировании.

Я хочу иметь возможность изменять размер и центр своего изображения логотипа (которое в настоящее время занимает всю страницу предварительного просмотра), но я пробовал так много разных способов изменения размера в 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%;
}

Комментарии:

1. если вы хотите, чтобы ваше изображение логотипа находилось в центре, так дайте display: block и margin: auto вашему изображению. и для изменения размера дайте ширину.

Ответ №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.1amp;ixid=MnwxMjA3fDB8MHxleHBsb3JlLWZlZWR8Mnx8fGVufDB8fHx8amp;w=1000amp;q=80" alt="">
  
     
    </div>
  </body>
</html>

Комментарии:

1. Просто попробовал, ничего не происходит, он все еще огромный, занимает всю страницу. Это потому, что это изображение из каталога? Я просто не понимаю, почему это не меняется

2. нет, это не так, не могли бы вы предоставить мне img для меня? или дайте мне ссылку на изображение, которое вы скачали.

3. Его png включен для задания, я не уверен, как загрузить изображение сюда

Метки: