Веб-сайт Фоновое изображение - Как?

У вас есть запрос на основе следующих CSS и HTML-кода (см. Ниже)Веб-сайт Фоновое изображение - Как?

У меня есть фоновое изображение, которое охватывает всю страницу браузера (слева направо), и это не то, что мне нужно.

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

Спасибо.

body { 
background-color: #ffffff; 
margin:0px; 
padding:0px; 
background-image: url(images/background.jpg); 
background-repeat: repeat-x; 
background-attachment: scroll; 
} 

#main { 

width:850px; 
margin: 0px auto 0px auto; 
border: 0px solid #f0f0f0; 

} 

<body> 

<div id="main"> 
<img src="images/female_model.jpg" id="female_model" alt="" /> 
<div id="colwrap1"> 
<img src="images/nav_bar.jpg" id="nav_bar" alt="" /> 
<img src="images/site_name.jpg" id="site_name" alt="" /> 
</div> 
</div> 

</body>

источник

2010-02-07 tonyf

Как насчет того, чтобы вы просто поместили фоновое изображение на #main?

источник

2010-02-07 13:06:00 Gareth

Если вы хотите прикрепить фон к main DIV, тогда укажите фон. Похоже, вы хотите, чтобы фон был центрирован по горизонтали (background-position: 50%;), но повторяйте для вертикальной протяженности DIV (background-repeat: repeat-y;).

body { 
    background-color: white; 
    margin: 0px; 
    padding: 0px; 
} 

#main { 
    background-image: url(images/background.jpg); 
    background-repeat: repeat-y; 
    background-position: 50%; 

    // rest as before ... 
    width: 850px; 
    ... 
} 

<div id="main"> 
    Lorem ipsum dolor sit amet, ...

Если фоновое изображение не появляется это может быть потому, что изображение недоступно или main DIV не имеет высоту - что может произойти, если female_model и colwrap1 как поплавок.

источник

2010-02-07 13:07:05

Спасибо за это, но, к сожалению, мое фоновое изображение больше не появляется. FYI, мой фоновый файл изображения представляет собой вертикальную полосу, размер которой равен 22x600. Любая дополнительная помощь будет оценена. Я использую Chrome или FF в Mac OS X. Спасибо. – tonyf

Затем оставьте линию фона-повтора Домонином – Mark

Все еще не работает - действительно думал, что это будет легко, но это меня сильно смущает! – tonyf

Dominic является правильным. Переместите свойства фона из тела в основной div, и вы должны иметь то, что вам нужно.

Если я правильно понял ваш вопрос, вы хотите установить фон страницы белый и есть фон вашего основного DIV быть все изображение, установить его - правильно?

Если да, то установка тело:

body 
{ 
    background:#fff; 
}

должен сделать трюк.

Теперь я также заметил, что изображение, которое вы хотите использовать, имеет меньшую ширину, чем ваш div. Таким образом, вы будете хотеть основной иметь следующие свойства:

#main 
{ 
    background-image:url(myimage.jpg); 
    background-position:top; 
    background-repeat:repeat-x; <!-- you need this as your image is < than the div width --> 
}

Это должно сделать трюк. Если он все еще не работает, возможно, вы хотите разделить ссылку на странице на своем сервере. Возможно, мы неправильно поняли ваш вопрос.

источник

2010-02-07 13:13:11 noobzilla

нет пойдите к сожалению. – tonyf

Веб-сайт Фоновое изображение - Как?

ответ

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