@Ewexon

Как разместить фотографию на весь эркан в зависимости от ориентации экрана?

Нужно сделать что-бы на разных экранах менялась фотография, например:

Для landscape
<img class="bg" src="1920-1080.png"></img>

Для portrait
<img class="bg" src="1080-1920.png"></img>

Вот css
body, html {
  height: 100%;
  margin: 0;
  overflow-y: hidden;
}

.bg {
  height: 100%; 
  size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
  • Вопрос задан
  • 49 просмотров
Решения вопроса 1
Kozack
@Kozack Куратор тега CSS
Thinking about a11y
Думаю вот так должно работать
<picture>
 <source srcset="1080-1920.png" media="(orientation: portrait)">
 <img src="1920-1080.png" alt="MDN">
</picture>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы