фоновые изображения

inf82

Новичок
3
0 / 0

фоновые изображения

« : 07.04.2010, 15:38:05 »

Делаю шаблон который должен выглядеть вот так

"Top" и "End" это картинки. Надо чтобы нижняя картинка была всегда внизу сайта, в зависимости от количества наполнения. И чтобы текст (т.е. content) был поверх этих двух картинок.
вот куски кода.
index.php
[spoiler title=index.php]

Код: php

<body>
<div id="wrap">
	<div id="sidebar">
		<jdoc:include type="modules" name="left" style="xhtml" />
	</div>
	<div id="content">
		<jdoc:include type="module" name="breadcrumbs" style="none" />
		<jdoc:include type="component" /> 
	</div>
	<div id="sidebar-2">
		<jdoc:include type="modules" name="right" style="xhtml" />
	</div>
</div>  
<div id="topdiv">&nbsp;</div>
<div id="enddiv">&nbsp;</div>
</body>

[/spoiler]

template.css
[spoiler title=template.css]

Код: css

#topdiv {
background-image:url(../images/top.png);
background-repeat: no-repeat;
width:100%;
height:360px;
background-position: center;
top:0px;
position:absolute;
}

#enddiv {
background-image:url(../images/end.png);
background-repeat: no-repeat;
width:100%;
height:440px;
background-position: center;
bottom:0px;
position:absolute;
}

body {
text-align:center;
background-color: #FFF;
}

#wrap {
width:auto !important;
text-align:left;
}

#content {
float:left;
width:50%;
}

#sidebar,#sidebar-2 {
float:left;
width:25%;
}

[/spoiler]

Что надо исправить ?

« Последнее редактирование: 07.04.2010, 18:07:35 от inf82 »

Записан

slyboots

Новичок
2
0 / 0

Re: фоновые изображения

« Ответ #1 : 07.04.2010, 18:57:39 »

Почитай про наложение слоев, например это http://www.htmlbook.ru/content/?id=99

Записан

Alldar

Завсегдатай
1504
195 / 1

Re: фоновые изображения

« Ответ #2 : 07.04.2010, 19:04:44 »

Для END сделай фон для <body> и прибей его к низу
А для Top создай отдельный блок с фоном

Записан

Сайт о Joomla - CMSCafe

inf82

Новичок
3
0 / 0

Re: фоновые изображения

« Ответ #3 : 08.04.2010, 07:05:52 »

Цитата: slyboots от 07.04.2010, 18:57:39

Почитай про наложение слоев, например это http://www.htmlbook.ru/content/?id=99

вот кстати про z-index тоже вопрос был.
Можно ли в моем шаблоне назначить z-index:3 блоку "wrap" а "Top" и "End" z-index:1 и z-index:2.
А то я пробовал но как понял на "content" (т.е. <jdoc:include type="component" /> ) z-index никак не влияет.

Цитата: Alldar от 07.04.2010, 19:04:44