Как сделать изображения адаптивными в CSS?

Question

Accepted Answer

## Базовый паттерн

```css
img, video {
  max-width: 100%;
  height: auto;
}
```

Для обложек в фиксированной рамке — `object-fit`:

```css
.thumb {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
```

Дополняйте HTML: `srcset`/`sizes` или `<picture>`. Контейнеры с `overflow: hidden` + cover — для карточек; для контентных фото чаще contain/`height: auto`.

## Итог

`max-width: 100%` + `height: auto` — минимум. `object-fit` и `aspect-ratio` — для контролируемых кадров; выбор файла — через responsive images в HTML.