Вертикальное изображение на рабочем столе при загрузке отображается горизонтально на веб-странице - PullRequest
Новая
       11

Вертикальное изображение на рабочем столе при загрузке отображается горизонтально на веб-странице

0 голосов
/ 03 мая 2018

Я пытаюсь создать сайт с нуля, чтобы продемонстрировать свои работы. Я использую простые CSS и HTML. Моя исходная ориентация изображения - вертикальный или портретный формат на рабочем столе, и он должен быть в этом формате. Однако при загрузке с рабочего стола с помощью HTML на notepad ++ он отображается в горизонтальном или альбомном формате. Я использовал простой простой HTML для загрузки изображения. Код ниже: 

<img src="Paintings/OystersTopoChico.jpg" alt="OystersTopoChico" 
title="Oysters and Topo Chico" width="500" height="377"./>

Кто-нибудь когда-либо сталкивался с этой проблемой раньше? Какие-либо решения?

* Следует отметить, что я столкнулся с подобной проблемой пару лет назад, когда использовал Other People's Pixels - веб-сайт портфолио для художников и дизайнеров.

1 Ответ

0 голосов
/ 03 мая 2018

Без каких-либо примеров кода, это удар в темноте. 

body {
  margin: 0;
}
img {
  width: 250px;
  height: 250px;
  object-fit: contain;
  /* these rules below are not needed */
  border:1px solid red;
  display:inline-flex;
  padding:5px;
}
<img src="https://www.technowalkers.com/wp-content/uploads/2017/10/html.jpg" />
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/61/HTML5_logo_and_wordmark.svg/2000px-HTML5_logo_and_wordmark.svg.png" />

Задавая img определенного размера и сообщая, что объект должен соответствовать изображению, он помещается в контейнер и сохраняет свое соотношение сторон

...