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

Посмотрите на этой странице: rozbub фон HTML изображения не прокручивается

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

В принципе, я определил основные обертки следующим образом:

body{ 
    width: 100%; 
    height: 100%; 
    overflow: hidden; 
    margin: 0px; 
} 

#generalWrapper{ 
    height: 100%; 
} 

#header{ 
    height: 70px; 
    width: 100%; 
    background: #080808; 
} 

#content{ 
    overflow: auto; 
    position: absolute; 
    width: 100%; 
    top: 70px; 
    bottom: 0; 
    background: url("../images/background.jpg"); 
    background-repeat: repeat-y; 
}

со структурой, как

<body> 
    <generalWrapper> 
     <header> 
     </header> 
     <content> 
     </content> 
    </generalWrapper> 
</body>

Затем содержимое div заполняется элементами (которые делают этот div выше, чем экран и приводит к прокручиваемости). Но почему фоновое изображение не влияет?

источник

2013-02-18 Valentino Ru

Возможно, вы захотите рассмотреть использование более широкого фонового изображения. Я на мониторе размером 2560 пикселей, а фон занимает примерно 3/4 ширины экрана; остальное - сплошной белый фон. – Jules

Я попробовал другой подход. Прежде всего, я положил фоновое изображение на HTML, со следующими атрибутами

html{ 
    background: url("../background.jpg") center center #000; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

Затем я изменил заголовок и содержание

#header{ 
    height: 70px; 
    width: 100%; 
    background: #080808; 
    position: fixed; 
    z-index: 55; 
    box-shadow: 5px 5px 5px 5px #080808; 
} 

#content{ 
    position: absolute; 
    width: 100%; 
    top: 70px; 
    bottom: 0; 
}

что приводит к точно такому поведению я желаемому (Хотя проблема, рассмотренная Жюлем Мазуром в комментарии, не решена, я постараюсь решить это, предоставив разные образы для разных разрешений).

источник

2013-02-20 00:18:39

Похоже, что вы прокручиваете div S внутри вашего contentdiv, но content сам div не прокручивается. Попробуйте просмотреть список ошибок, найденных на вашем сайте, по W3C's Markup validator.

источник

2013-02-18 20:16:55 Olexiy

Попробуйте установить background-attacment на номер scroll. MDN имеет документацию для этой недвижимости.

источник

2013-02-18 20:20:38 Jules

Жюль, я бы посоветовал использовать W3Schools для любой технической справки, при необходимости использовать более достоверный источник, такой как MDN https://developer.mozilla.org/es/docs/CSS/background, вот почему W3Schools следует избегать http: //w3fools.com/ – leopic

leopic, Этот сайт не упоминает, почему следует избегать W3Schools. Что такое «неопровержимо» в W3Sschools. По крайней мере, через 4 года он все еще появляется в верхней части результатов поиска Google, так что это говорит? – thefoyer

Популярность @thefoyer не является показателем надежности. W3Schools постоянно устарели и часто ошибаются. После 4 лет участия в программировании я могу честно сказать, что MDN является авторитетом _de facto_, когда речь идет о высококачественной документации по веб-стандартам. – Jules

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

ответ

Смежные вопросы