Schatten am Rand des Designs
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
beitrag
datei
demo
design
drum
gel
hintergrund
komplette design
leere spalte
mache
quelltext
schatten
telefonbuch
test
zeile
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Telefonbuch.de hat das ganze so gelöst:
Sie haben das komplette Design mit Tabelen realisiert (was allerdings sehr verpöhnt ist) und haben dann, einfach an der Seite und unten eine leere Spalte bzw Zeile frei gelassen und statt dessen einfach die 'Schattengrafik' als Hintergrund definiert (http://www.telefonbuch.de/img/000_bg_bottom.gif)
Geschickter ist es wenn du das ganze mit CSS löst hier der Quelltext:
link zur Demo:http://x-web.lima-city.de/rabish/test.htm
<html>
<head>
<title>Schatten</title>
<style type="text/css">
#schatten{
background-image: url(000_bg_right.jpg);
background-repeat:repeat-y;
padding-left:10px;
}
#schatten2{
background-image: url(http://www.telefonbuch.de/img/000_bg_bottom.gif);
background-repeat:repeat-x;
height: 30px;
margin-left:10px;
}
#content{
background-color: #888888;
border-color: #000000;
border-width: 1px;
border-style: solid;
padding: 10px;
}
</style>
</head>
<body>
<div id="schatten">
<div id='content'>
<h1>Hier ist ein schatten drum herum</h1>
<p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text
Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text
Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text
</p>
</div>
</div>
<div id="schatten2">
</div>
</body>
</html>
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
