фоновое изображение после заголовка - PullRequest
Новая
       2

фоновое изображение после заголовка

1 голос
/ 17 августа 2011

Рабочая демонстрация: http://jsbin.com/opokev/54

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

Как я могу исправить это так, чтобы сначала рисовался заголовок, а затем фоновое изображение тела.Я все еще хочу сохранить качество изображения без изменения масштаба.

Ответы [ 3 ]

1 голос
/ 17 августа 2011

Вот, пожалуйста, http://jsbin.com/opokev/64/

только что изменили top: 0 на top: 85px и все работает.

0 голосов
/ 17 августа 2011

Удалите тег img и используйте background-image для div#background.Затем установите background-position на center 85px.

Комбинированный CSS: 

div#background
{
    background:url('http://i52.tinypic.com/33xd1yu.jpg') no-repeat center 85px;
    width:100%;
    height:100%;
}

Это сместит фоновое изображение вниз на 85px.

0 голосов
/ 17 августа 2011

Попробуйте использовать background-position. 

background-position: 0px 85px;

Мог бы сделать трюк:)

Или вы можете попробовать использовать это: 

#background img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 85px;
    left: 0;
    z-index: -1;
}

Я не вижу никакой разницы в этих фонах (думая о масштабировании):

http://jsbin.com/opokev/54

http://jsbin.com/ijoyiy/2

Опять же, я нахожусь в 2 минутах от сна и у меня нет очков;)

...