Page: 1 
stuetzl
Show profile
Link to this post
Subject: Hintergrund mit überlagernden Images
Hi alle zusammen. Ich versuch gerade von einem Perl-basierenden Forum aufs UNB umzusteigen und bin schon auf erste Probleme gestossen, da ich mich sehr wenig mit PHP auskenne (hm... die templates sind zwar html, aber trotzdem).
Wie der Titel schon andeutet, möchte ich nicht einfach nur ein Image als Hintergrund, sondern noch in jeder ein Ecke eines, die den Hintergrund dann quasi einrahmen.
http://ravenport.ch/cgi-bin/forum/Blah.pl
dem Link folgend seht ihr wie ich mir das vorstelle. Wie ihr jetzt seht, hat das (mit Biegen und Brechen
) auch geklappt, indem ich einfach das template etwas überarbeitet hab ( "[...]" soll heissen, dass dort noch mehr Code ist, der aber für meine Frage unwesentlich ist) :
Im stylesheet sieht's dann so aus:
So, und jetzt wie gesagt: Wie kann ich diese "Ecken" ins UNB bringen? Die Templates findet man ja beim jeweiligen Design, aber in welches müsste ich das einbinden?
gruss stuetzl
PS: Der braune, ledrige Hintergrund ist übrigens "bg.gif". die anderen .gifs jeweils die "Ecken"
Wie der Titel schon andeutet, möchte ich nicht einfach nur ein Image als Hintergrund, sondern noch in jeder ein Ecke eines, die den Hintergrund dann quasi einrahmen.
http://ravenport.ch/cgi-bin/forum/Blah.pl
dem Link folgend seht ihr wie ich mir das vorstelle. Wie ihr jetzt seht, hat das (mit Biegen und Brechen
) auch geklappt, indem ich einfach das template etwas überarbeitet hab ( "[...]" soll heissen, dass dort noch mehr Code ist, der aber für meine Frage unwesentlich ist) :<body>
[...]
<div id="book">
<div id="top">
<div id="lefttop"></div>
<div id="righttop"></div>
</div>
<div id="container">
[...]
</div>
<div id="bottom">
<div id="leftbottom"></div>
<div id="rightbottom"></div>
</div>
</div>
[...]
</body>
[...]
<div id="book">
<div id="top">
<div id="lefttop"></div>
<div id="righttop"></div>
</div>
<div id="container">
[...]
</div>
<div id="bottom">
<div id="leftbottom"></div>
<div id="rightbottom"></div>
</div>
</div>
[...]
</body>
Im stylesheet sieht's dann so aus:
#book {
width : 90%;
padding : 0px;
border : 3px ridge #222;
margin : 10px auto;
background : white url(images/bg.gif) repeat;
min-height : 75px;
}
div#top {
position: relative;
background: transparent url(images/bg.gif) repeat;
top: 0;
left: 0;
height: 75px;
}
div#lefttop {
background: transparent url(images/lefttop.gif) no-repeat;
position: relative;
top: 0;
left: 0;
height: 75px;
width: 75px;
float: left;
}
div#righttop {
background: transparent url(images/righttop.gif) no-repeat;
position: relative;
top: 0;
right: 0;
height: 75px;
width: 75px;
float: right;
}
[...]
}
div#leftbottom {
background: transparent url(images/leftbottom.gif) no-repeat;
position: relative;
bottom: 0;
left: 0;
height: 75px;
width: 75px;
float: left;
}
div#rightbottom {
background: transparent url(images/rightbottom.gif) no-repeat;
position: relative;
bottom: 0;
right: 0;
height: 75px;
width: 75px;
float: right;
}
width : 90%;
padding : 0px;
border : 3px ridge #222;
margin : 10px auto;
background : white url(images/bg.gif) repeat;
min-height : 75px;
}
div#top {
position: relative;
background: transparent url(images/bg.gif) repeat;
top: 0;
left: 0;
height: 75px;
}
div#lefttop {
background: transparent url(images/lefttop.gif) no-repeat;
position: relative;
top: 0;
left: 0;
height: 75px;
width: 75px;
float: left;
}
div#righttop {
background: transparent url(images/righttop.gif) no-repeat;
position: relative;
top: 0;
right: 0;
height: 75px;
width: 75px;
float: right;
}
[...]
}
div#leftbottom {
background: transparent url(images/leftbottom.gif) no-repeat;
position: relative;
bottom: 0;
left: 0;
height: 75px;
width: 75px;
float: left;
}
div#rightbottom {
background: transparent url(images/rightbottom.gif) no-repeat;
position: relative;
bottom: 0;
right: 0;
height: 75px;
width: 75px;
float: right;
}
So, und jetzt wie gesagt: Wie kann ich diese "Ecken" ins UNB bringen? Die Templates findet man ja beim jeweiligen Design, aber in welches müsste ich das einbinden?
gruss stuetzl
PS: Der braune, ledrige Hintergrund ist übrigens "bg.gif". die anderen .gifs jeweils die "Ecken"
schema.jpg 39.3 kBytes
This post was edited 2 times, last on 2007-12-05, 21:15 by 
Mit 'um den gesamten Bereich herum' meinte ich, daß Du wahrscheinlich einen Hintergrund für alles haben willst, d.h. inklusive Navigation, Loginbereich, Fußzeile, ...
- An meiner Antwort ändert es eigentlich auch nichts.