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

Разбираемся в CSS
Ответить
Anonymous
 Как мне стилизовать изображение до максимальной высоты в зависимости от его ориентации?

Сообщение Anonymous »


Как стилизовать изображение в зависимости от его ориентации? У меня есть список элементов в сетке. До сих пор я использовал только пейзажные изображения, но теперь хочу начать использовать портретные изображения.

Есть ли способ заставить CSS распознавать, если высота изображения больше ширины, и соответственно устанавливать высоту?

Я имею в виду, что я могу установить для max-height фиксированную длину, но изображение будет искажено. Чего я действительно хочу, так это того, чтобы альбомное изображение сохраняло свой размер, а портретное изображение уменьшало его высоту до размера высоты ландшафта.

Есть ли способ сделать это?

Я собирался использовать только CSS. Но это проект Angular, поэтому я могу использовать js, если нет другого способа.

Чтобы быть более понятным, я хочу, чтобы на этих изображениях я использовал max-width: 100%; максимальная высота: 10em; настройка:


Изображение


выглядеть так:


Изображение


Итак, уменьшенное изображение должно иметь возможность появляться в любом месте сетки, а не в том, что есть область уменьшенных изображений и ряд обычных изображений. Они могут располагаться в одном ряду, как показано.
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»