как я могу решить эту проблему с негативным изображением в моей простой HTML-фотогалерее с поиском изображений в каталоге по PHP? Я не могу это решить, и это не визуально хорошо. Не могли бы вы мне помочь? На скриншотеИзображение большего размера в HTML
Спасибо.
Установите все изображения с тем же классом, а затем добавьте высоту изображения в этот класс и установите для изображений все одинаковые высоты.
Вот пример того, что я только что сделал - http://jsfiddle.net/3gd5ooLf/
Я не знаю, как вы получаете изображение в PHP, так что я не могу сказать вам, как установить класс, не видя код.
вот пример CSS:
.height {
height: 100px;
}
Это может быть хорошим примером для вас. Обращайтесь также к старому вопросу stackoverflow. вот ссылка: link
.img {
position: relative;
float: left;
width: 100px;
height: 100px;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
}
<div class="img" style="background-image:url('http://i.imgur.com/tI5jq2c.jpg');"></div>
В файле CSS, вы можете добавить heigth и свойство ширины для регулировки размера изображения.
Например:
img {
heigth:200px;
width: auto;
}
установит heigth в 200px, но будет держать соотношение сторон. Для того, чтобы иметь квадратные изображения, установить ширину, например, 200px
Если вы предпочитаете, вы можете установить изображение, которое будет прокручивать, когда он слишком долго, как так:
img {
height:200px;
width:200px;
overflow: scroll;
}
Что вы имеете в виду под «изображением припуск "? Может быть, вы должны указать, что именно вы хотите достичь, например, «Я хочу, чтобы все изображения имели одинаковый размер (200x200)». И как вы хотите обрабатывать пропорции? Всегда сохраняйте соотношение сторон? Вы хотите показать только урожай фотографии, если соотношение отключено? Вы хотите показать черные полосы? белые бары? – light