• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

2 Hintergründe übereinander

DFPWare

Neues Mitglied
Hallo Leute
Ich habe da mal eine Frage, und zwar will ich oben in meiner Homepage ein Bild als Hintergrund festlegen(so wie das Grau-Grüne oben auf dieser Seite) und dann darunter einen anderen Hintergrund einfügen (also hier alles was größtenteils weiß ist, ab "Forum"), der aber unabhängig von dem oberen ist.
Danke
DFPWare
 
Falls ich dich richtig verstanden habe, möchtest du einen Banner, und hinter den Content einen "zweiten" Hintergrund? Hier in diesem Forum ist es denke ich so geregel, dass man zwei divs hat, den Header mit der Grafik und dann den Content mit weißer Hintergrundfarbe...
Ich weiß nicht genau, ob dir das hilft?
 
Also ich denke du hast verstanden was ich will ;-)
Wenn nicht dann versuch ich das nochmal zu erklären:
Ich habe folgenden Code:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title>Willommen auf der DFPWare Homepage</title>
  <link rel="stylesheet" href="Cascading.css" type="text/css">
  </head>
  <body background="bilder/top.bmp">
  

  </body>
</html>
top.bmp ist das Banner oder wie auch immer das heißt ;-)
Wie bekomm ich jetzt noch einen zweiten Hintergrund darunter?
DFPWare
PS:Bitte mit Code sonst raff ich das nich :D
 
Hey Ja hatte ich eh noch vor, aber nur so zu meiner Verteidigung: Ich weiß was div, Header und Content bedeutet okay?:D
DFPWare
Hab mir den Post 10 mal durchgelesen, jetzt hab ich es hinbekommen.
Danke ;)
 
Zuletzt bearbeitet:
Hey ich bins nochmal.
Und zwar klappt das jetzt schon ganz gut, aber Der Hintergrund wird immer nur so hoch wie der Text hoch ist und rechts daneben ist auch noch ein weißer Rand.

Wie bekomm ich das denn jetzt weg?
Danke
DFPWare
 
Oh tut mir leid, hab ich vergessen:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title>Willommen auf der DFPWare Homepage</title>
  <link rel="stylesheet" href="Cascading.css" type="text/css">
  </head>
  <body>
  <div id="topofthepage">
    <br>
    <div id="links"><ul><li><a href="index.html" >Startseite</a></li><li><a href="download.html">Downloads</a></li><li><a href="vergleich.html">Warum AutoIt?</a></li><li><a href="getstarted.html">Get started!</a></li></ul> </div>
  </div>
  <div id="restofthepage">
    <h1>Herzlich Willkommen auf der Homepage von Darwin und Flo!</h1>
    <div id="zwischenheader">Was will ich hier!?</div>
    <p>Auf dieser Seite werden Sie einige downloads zum Thema AutoIt finden, sowie eine Sammlung von Links, wie man mit AutoIt anfangen kann.</p>
    <div id="zwischenheader">Wer seid ihr überhaupt!?</div>
    <p>Wir sind ein paar naturwissenschaftlich begabte Jungs, die sich gerne dem Programmieren, hauptsächlich mit AutoIt, zuwenden.</p>
    <p>Im AutoIt.de Forum könnt ihr uns unter dem Namen DFPWare finden, genauso wie auf Youtube.</p>
    <p>Wenn ihr uns kontaktieren wollt, dann schreibt am besten eine Nachricht an unseren Youtube Account oder an den AutoIt.de Account.</p>
  </div>
  </body>
</html>
und hier die css Datei:
Code:
a:link,
a:visited {text-decoration:none;
           color:blue;
           font-size:18px;
           font-family:Arial;
		   font-variant:small-caps;}
a:focus,
a:hover {text-decoration:underline;
         color:black;
         font-size:18px;
         font-family:Arial;
		 font-variant:small-caps;}
		 
a:link#links,
a:visited#links {text-decoration:none;
        	  	 color:blue;
        	  	 font-size:18px;
        	  	 font-family:Arial;
			 	 display:inline;
			 	 text-align:left;
			  	 float:left;
			  	 margin-left:30px;
			  	 font-variant:small-caps;}
a:focus#links,
a:hover#links {text-decoration:underline;
         	   color:black;
         	   font-size:18px;
         	   font-family:Arial;
			   display:inline;
			   text-align:left;
			   float:left;
			   margin-left:30px;
			   font-variant:small-caps;}
			   
a:link#rechts,
a:visited#rechts {text-decoration:none;
        	   	  color:blue;
        	      font-size:18px;
        	      font-family:Arial;
			      display:inline;
			      text-align:right;
			      float:right;
			      margin-right:30px;
				  font-variant:small-caps;}
a:focus#rechts,
a:hover#rechts {text-decoration:underline;
         	    color:black;
         	    font-size:18px;
         	    font-family:Arial;
			    display:inline;
			    text-align:right;
			    float:right;
			    margin-right:30px;
				font-variant:small-caps;}
         
h1 { color:blue;
     font-size:40px;
     font-family:Arial;
     text-align:center;
	 text-shadow: 3px 3px #666; }
h2 { font-size:0px;}
h3 { color:black;
     font-size:20px;
     font-family:Arial;}
h4 { color:black;
     font-size:15px;
     font-family:Arial;}
h5 { color:black;
	 font-size:20px;
	 font-family:Arial;}
p { color:black;
    font-size:25;
    font-family:Arial;}

ul li {
display:inline;
padding:10px 35px 10px 0;
}

ul li a:link,
ul li a:visited {text-decoration:none;
        	     color:#79ABFF;
        	     font-size:28px;
       	  	     font-family:Arial;
				 font-variant:small-caps;}
ul li a:focus,
ul li a:hover {text-decoration:underline;
         	   color:black;
         	   font-size:28px;
         	   font-family:Arial;
			   font-variant:small-caps;}
		
#left {
	float:left;
	margin-left:150px;
}

#right {
	float:right;
	margin-right:250px;
}
img {
    border:none;
    text-decoration:none;
}
#links {
  margin-top:100px;
  margin-left:-30px
}
#topofthepage {
  background-image:url(bilder/top.bmp);
  margin-top:-10;
  margin-left:-10;
}
#restofthepage {
    background-image:url(bilder/rest.bmp);
    margin-top:-25;
    margin-left:-10;
}              
#zwischenheader {
  text-decoration:bold;
  text-decoration:underline;
  font-family:Arial;
  font-size:25}
 
Zurück
Oben