Bezdepbonusu7Программирование: статьи и ответы
Меню

Вопрос

Простое фоновое изображение без прокрутки

Автор вопроса: Jon FerriterОтветов: 1

У меня есть, вероятно, простой вопрос, но я не могу найти на него ответ. У меня есть фоновое изображение, которое выглядит хорошо, плитки хорошо и отлично прокручиваются. Однако у меня есть второе фоновое изображение, наложенное поверх него, которое помещено внутри div-оболочки ("whiteBackground", я полагаю, оно называется), и я не хочу, чтобы оно прокручивалось вместе со страницей. Поскольку содержимое и текст становятся длиннее и заставляют пользователя прокручивать страницу, я бы хотел, чтобы второй фон оставался статичным. Таким образом, когда пользователь прокручивает страницу вниз, создается впечатление, что второй фон просто совершенно неподвижен.

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

Любые идеи?

http://jsfiddle.net/SMc9R/

`#wrapper {
    position: relative;
    width:960px;
    min-height:768px;
    margin: 0 auto;
    background-image:url('images/white_background.png');
    background-attachment: fixed;
    font-family:'MuroRegular';
}`

Это основная часть, в которой, как мне кажется, проблема.

Там нет изображений, но я подумал, что моей разметки и CSS должно быть достаточно. Любая помощь будет оценена по достоинству. Большое спасибо!

  • Если вы хотите иметь два фона, можно использовать несколько фонов для одного элемента: Несколько фонов на одном элементе Arbel 11.05.2013

htmlcssbackground-image

Ответы

Ответ 1 · PraJen

Демонстрация: http://jsfiddle.net/SMc9R/1/. ВЫ хотите так.. или укажите какую-либо поправку относительно этой поправки...

 #banner {
position: absolute;
float:left;
width: 960px;
height:60px;
text-align: center;
font-family:'AmaticBold';
font-size: 50px;
background-image:url('images/banner.png');
background-repeat: no-repeat;
z-index: 4;
 }

Перевод вопроса и ответов сообщества Stack Overflow, лицензия CC BY-SA. Оригинал на Stack Overflow.

Похожие материалы