Как изменить размер картинки в html

Аватар пользователя Aleksey
Aleksey
06 апреля 2023

Для изменения размера картинки в HTML можно использовать атрибуты width и height тега <img>. Например, чтобы уменьшить размер картинки до 300 пикселей по ширине, можно написать следующий код:

<img src="image.jpg" alt="Картинка" width="300" />

Если нужно изменить размер картинки пропорционально, можно указать только ширину или только высоту, а другое значение будет автоматически рассчитано браузером. Например, чтобы уменьшить размер картинки до 300 пикселей по ширине, а высота менялась пропорционально, можно написать так:

<img src="image.jpg" alt="Картинка" width="300" />

Также можно задавать размеры картинки через CSS, используя свойства width и height. Например:

<style>
  .my-image {
    width: 300px;
    height: auto;
  }
</style>

<img src="image.jpg" alt="Картинка" class="my-image" />

В этом примере мы задаем ширину картинки в 300 пикселей и высоту автоматически рассчитывается браузером, чтобы сохранить пропорции картинки. Картинке также добавлен класс my-image, который мы использовали для применения стилей.

0 0

Похожие вопросы