0

Здравствуйте. Интересует казалось бы простой вопрос. Есть прямоугольная фотография. Но на сайте под неё отведена квадратная форма И если сделать например <img width="250" height="250"> то мы получим сжатую по вертикали или горизонтали фотографию. Как этого избежать? Хотелось бы увидеть 2 реализации. 1.Что бы выбирался верхняя часть (при высокой фотографии) или левая (при широкой). 2.Что бы выбиралась центральная часть. Гуглить не помогло. Заранее спасибо !

3 ответа 3

1

погуглите ещё на тему background-size. Поможет.

<div class="image" style="background-image: url(photo.jpeg)"></div>

и в css:

.image {
    width: 250px;
    height: 250px;
    background: center top no-repeat;
    background-size: cover;
}
0

Попробуйте таким кодом .img { display: inline-block; width: 150px; height: 100px; overflow: hidden; background: #FFFFFF; margin-top: 5px; margin-left: 15px;

  }
  .img img {
   width: 150px;
    border: none;
    margin: 0;
    padding: 0;
  }

Только размеры и бакграунд под себя подстройте.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.