Как сохранить фоновое изображение слева внизу даже при прокрутке - PullRequest
Новая
       6

Как сохранить фоновое изображение слева внизу даже при прокрутке

9 голосов
/ 14 июля 2010

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

html, body 
{
background-image:url("backgroundBottom.png");
background-position:bottom left;
background-repeat:no-repeat;
background-attachement:fixed;   //I just add this, don't think this would work.
font-family:"Georgia, self";
font-size:"30px";
margin:0px;
height:100%;
text-align:center;
}

Ответы [ 3 ]

20 голосов
/ 14 июля 2010

Вы устанавливаете фон для обоих элементов HTML и BODY.

Код выглядит хорошо, background-attachment: fixed - это то, что вам нужно.

Так что в сокращенном CSS, простонаписать 

body {
    background: url(backgroundBottom.png) bottom left no-repeat fixed;
}
3 голосов
/ 14 июля 2010

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

<div id="BackgroundImage"></div>

Затем используйте следующий код CSS 

#BackgroundImage{position: fixed; width="xx"; height="yy"; bottom:0px; left:0px;}

, явно настроенный для ваших нужд

Суть position:fixed

Создает абсолютно позиционированный элемент, расположенный относительно окна браузера.Положение элемента задается свойствами «left», «top», «right» и «bottom»

http://www.w3schools.com/Css/pr_class_position.asp

1 голос
/ 13 июня 2012

вы использовали background-attach * e * ment: fixed;

попробуйте написать его лучше, например background-attachment: fixed;

...