[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: Фон на всю ширину страницы
Гость_User
Здравствуйте.
Есть блок шириной 1000 пикселей. В нем все содержимое сайта.
Как сделать такой фон (на оставшуюся ширину страницы): вверху один рисунок, повторяющийся по горизонтали (грубо - полоса одного цвета шириной 1 px), внизу - другой (полоса другого цвета ).
Вот о чем речь:
http://www.uploadscreenshot.com/image/239265/1161099

Фон сверху задаю так. Полоска нужной высоты шириной в один пиксель с повторением по-горизонтали. Задаю ее фоном тегу html.








Спустя 13 минут, 44 секунды (12.02.2011 - 14:34) DmitryOpalev написал(а):
В чем вопрос?

Спустя 57 минут, 3 секунды (12.02.2011 - 15:31) alex12060 написал(а):
Вообще, это сделано 1 линией, на которой 2 разных цвета)

Спустя 33 минуты, 3 секунды (12.02.2011 - 16:04) Гость_User написал(а):
Высота страницы может менятьсяю Как быть с полосой в этом случае?

Спустя 1 час, 28 минут, 46 секунд (12.02.2011 - 17:33) inpost написал(а):
Извини, но ничего не понятно =(

Спустя 11 часов, 57 минут, 35 секунд (13.02.2011 - 05:30) Гость_User написал(а):
Сайт с центральным блоком. Его ширина 1000 пикселей. При разрешении более 1024 точек по-горизонтали становится виден фон (HTML). Как сделать, чтобы сверху страницы и в самом низу, независимо от высоты текущей страницы, были полосы разных цветов во всю ширину окна браузера. А цвет между ними был равен цвету фона (HTML)?

Спустя 19 минут, 5 секунд (13.02.2011 - 05:49) inpost написал(а):
Разбить на 2 части:
<div style="width:100%">
<div
style="width:1000px;">
КОНТЕНТ
</div>
</div>
<div
style="width:100%">
<div
style="width:1000px;">
КОНТЕНТ
</div>
</div>

Спустя 1 час, 4 минуты, 55 секунд (13.02.2011 - 06:54) Сандин написал(а):
http://htmlbook.ru/css/background-repeat
К сожалению я не знаю можно ли сразу внизу и вверху..но если прописать к боди
x-repeat то будет повторятся твоя картинка по верху..могу предложить тебе див запилить вниз и сделать стиль ещё раз с x-repeat.

Спустя 6 дней, 16 часов, 35 минут, 19 секунд (19.02.2011 - 23:30) AntonMMF написал(а):
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta
http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link
rel="stylesheet" type="text/css" href="style.css" />
<title>
Документ без названия</title>
</head>

<body>
<div
class="top">
</div>

<div
class="bottom">
</div>

<div
class="content">
</div>
</body>
</html>



style.css
* {
margin: 0px;
padding: 0px;
}

.top {
background-attachment: fixed;
background-color: red;
height: 50%;
position: fixed;
top: 0px;
width: 100%;
z-index: 0;
}

.bottom {
background-attachment: fixed;
background-color: green;
bottom: 0px;
height: 50%;
position: fixed;
width: 100%;
z-index: 0;
}

.content {
background-color: white;
height: 1500px;
margin: 0 auto;
position: relative;
width: 1000px;
z-index: 1;
}

user posted image

Если я правильно понял суть вопроса.
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.