0

Ребят, всем привет.

Подскажите, как реализовать. Есть картинка размером 1910 px. Хочу сделать, чтобы под каждое разрешение экрана она обрезалась, высота оставалась прежней. Как это сделать? Ниже принтскрин этой картинки. Сейчас есть внизу полоса прокрутки, хотя надо, чтобы она обрезалась.

Спасибо!

alt text

1 ответ 1

0

html:

<div class="img"></div>

css:

div.img {
background-image: url(urltoimage);
background-repeat:no-repeat;
background-position:top center;
width:100%;
height NNNpx;
}

Где:

urltoimage - путь к картинке

NNNpx - высота картинки

5
  • К сожалению, картинка будет вставляться через тег img.
    – duddeniska
    17 янв 2015 в 17:05
  • тогда центрируйте картинку, и делайте ей overflow:hidden;, должно помочь.
    – Crus
    17 янв 2015 в 17:06
  • Решил с помощью max-height:395px; max-width:100%;
    – duddeniska
    17 янв 2015 в 17:10
  • Разве при этом она не уменьшается пропорционально?
    – Crus
    17 янв 2015 в 17:28
  • 1
    @duddeniska, проблема того, что картинка вставляется в HTML, решается инлайновым стилем: <div style="background-image: url(urltoimage);"></div> Только не забудьте к диву применить в CSS те стили, что написал @Crus.
    – MasterAlex
    17 янв 2015 в 18:08

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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