nicht angemeldet
2 Hintergrundbilder übereinander
Gunnar Bittersmannhallo!
ich bekomme das problem nicht gelöst, wie ich zwei "hintergrundbilder" übereinander legen kann. als erstes hintergrundbild habe ich ein "tapetenmuster" darüber soll ein weißer kasten in die mitte der seite, auf dem der eigendliche seiteninhalt stehen soll. also die texte. in dem weißen kasten sind aber sterne. heißt, ich muß ihn als bild nehmen.
so sieht es jetzt aus:
html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>
<head>
<link rel="stylesheet"href="abendt_raum_style.css" type="text/css">
<title>abendt_raum</title>
</head>
<body background="hg.jpg"> das ist das tapetenmuster, hat funktioniert
<body>
<div id="zweiterbg"> das ist der weiße kasten, der zeigt sich aber
nur als streifen unter dem h1 und h2 text.
<h1>abendt_raum</h1>
<h2>visuelle gestaltung</h2>
<br>
</div>
</body>
</html>
css:
h1 {
color:black;
letter-spacing:20;
font-family:times, sans-serif; /* Schriftart */
}
h2 {
color:black;
letter-spacing:11;
font-family:times, sans-serif; /* Schriftart */
}
div#zweiterbg { background:url(hintergrundbild.jpg) bottom right no-repeat; width:100%; }
</style>
vielen dank für eure hilfe!
-
so sieht es jetzt aus:
<link rel="stylesheet"href="abendt_raum_style.css" type="text/css">ich wette fast, dass sämtliche anderen css deklarationen in abendt_raum_style.css auch nicht funktionieren ;)
eine frage noch - warum bekommt der body sein hintergrundbild im html als attribut und das andere element im css?
-
doch. alles andere funktioniert...ist das auch falsch?! zu deiner frage: weil ich es anders überhaupt nicht hin bekommen habe. heißt, dann hat sich der weiße kasten immer koplett über das tapenmuster gelegt. jetzt sehe ich zwar beide bilder, aber de weißen kasten kann ich weder positionieren, noch auf die größe bringen wie ich ihn haben will...also original größe..
-
doch. alles andere funktioniert...ist das auch falsch?!
kann ich mir nicht vorstellen - es sieht vielleicht wie gewünscht aus, funktionieren tuts aber sicher nicht
http://validator.w3.org/-
kannst du mir den was zu meiner fragestellung sagen?
-
kannst du mir den was zu meiner fragestellung sagen?
machs richtig und es wird seltsamerweise funktionieren - der w3 validator hilft
-
jetzt habe ich ein paar fehler beseitigt. jetzt weiß ich aber nicht wie´s weitergeht. kannst du bitte noch mal drüber schaun? danke!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html><head>
<link rel="stylesheet"href="abendt_raum_style.css" type="text/css">
<title>abendt_raum</title>
</head>
<body>
<div id="ersterbg">
<div id="zweiterbg">
<h1>abendt_raum</h1>
<h2>visuelle gestaltung</h2>
<br></body>
</html>
css:
h1 {
color:black;
letter-spacing:20;
font-family:times, sans-serif;
}
h2 {
color:black;
letter-spacing:11;
font-family:times, sans-serif;
}
div#ersterbg {
background:url(hintergrundbild.jpg); no-repeat
}
div#zweiterbg {
background:url(hg.jpg)
}
</style>-
@@stephie:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
Das schickt IEs in den Quirks-Mode [Jendryschik]. Das solltest du vermeiden – durch Doctype-Angabe mit system identifier (URI):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><link rel="stylesheet"href="abendt_raum_style.css" type="text/css">
▲
Da haste noch einen Fehler drin.<div id="ersterbg">
<div id="zweiterbg">
<h1>abendt_raum</h1>
<h2>visuelle gestaltung</h2>
<br></body>
</div>-End-Tags sind nicht optional.
font-family:times, sans-serif;
Eine bestimmte Serifenschrift (Times) als erste Wahl, wenn diese nicht vorhanden ist, irgeneine serifenlose?? Sehr seltsam.
div#ersterbg {
background:url(hintergrundbild.jpg); no-repeat▲
Bei zusammenfassenden Eigenschaften werden die einzelnen Werte nur durch Leerzeichen getrennt. Das ';' trennt zwei Deklarationen, 'no-repeat' ist keine gültige Deklaration. Es gibt auch einen CSS-Validator.div#zweiterbg {
background:url(hg.jpg)
}
</style>HTML-Tags haben in einer CSS-Datei nichts zu suchen.
Live long and prosper,
Gunnar--
Flughafen in Tempelhof
findet jeder Hempel doof.
-
-
Es hilft jemandem der nach etwas fragt herzlich wenig wenn man solche hochstehenden und tiefschürfenden Antworten gibt wie "machts richtig, dann wirds funktionieren....".
Genau solche eine Antwort hättest Du Dir wahrscheinlich auch gewünscht ... damals .... als Du selber noch Fragen stellen musstest, oder? *LOL*Trotzdem einen guten Appetit ;-))
kannst du mir den was zu meiner fragestellung sagen?
machs richtig und es wird seltsamerweise funktionieren - der w3 validator hilft
-
Es hilft jemandem der nach etwas fragt herzlich wenig wenn man solche hochstehenden und tiefschürfenden Antworten gibt wie "machts richtig, dann wirds funktionieren....".
hätte der OP meinen rat befolgt und den hinweise des w3 validators befolgt und das dokument validert, wären alle probleme wie von alleine verschwunden (bis auf die fehlerhaften css deklarationen, sieh gunnars post
auf den ersten offensichtlichen fehler habe ich bereits hingewiesen - ein fehlendens leerzeichen im <link /> element, dass damit das stylessheet überhaupt funktioniert ist ein wunder (auch das sage ich)
Genau solche eine Antwort hättest Du Dir wahrscheinlich auch gewünscht ... damals .... als Du selber noch Fragen stellen musstest, oder? *LOL*
gewünscht hab ich mir solche antworten sicher nicht, aber zur genüge erhalten - dadurch habe ich gelernt, meine probleme selbst zu lösen, sauberes und richtiges html zu schreiben und bei fehlern prinzipiell mal mit STRG+SHIFT+A (webdeveloper toolbar shortcut) den w3 validator zu befragen bevor ich mir irgendwelchen inhaltsleeren fragenstellungen komme
zudem, ich habs personlich viel lieber wenn mir jemand einen denkanstoß verpasst als wenn ich alles vorgekaut bekommen - natürlich wäre der html/css schnipsel des op in 2 minuten völlig neu und valide geschrieben, aber vor bleibt der lerneffekt?
Trotzdem einen guten Appetit ;-))
mahlzeit auch
-
-
-
-
-
-
-
Hi stephie
Ich denke "suit" meinte warum Du das DIV im CSS deklariert hast, aber den BODY nicht.
Hat zwar mit dem problem an sich wahrscheinlich nix zu tun, aber die frage ist berechtigt.Ich bin nicht ganz sicher, aber ich denke ein problem ist dass Du die ID div#zweiterbg und den Background-Image Style mit mehreren Attributen versehen hast.
Siehe unten mein Beispiel. Ich hatte Deine Bilder nicht, habe deshalb beim BODY Element eine Farbe genommen. Aber mit den auskommentierten Styles hat es ebenso funktioniert.
Soweit ich weiss, sollten Masse separat angegeben werden (width & height).Hier das Test Code von Dir & mir zusammen:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html><head>
<style type="text/css">
BODY{
background-color: red;
/*
background-image: url(icon_gray_disabled_leftarrow.gif);
background-repeat: repeat-x repeat-y; */
}
h1 {
color:black;
letter-spacing:20px;
font-family:times, sans-serif; /* Schriftart */
}
h2 {
color:black;
letter-spacing:11px;
font-family:times, sans-serif; /* Schriftart */
}
div#zweiterbg {
margin: 30px;
background-color: aqua;
width: 100%;
height: 100%;
text-align: center;
/*background:url(hintergrundbild.jpg) bottom right no-repeat; width:100%;*/
}
</style>
<title>abendt_raum</title>
</head>
<body>
<div id="zweiterbg"><h1>abendt_raum</h1>
<ul>
<li>
<h2>visuelle gestaltung</h2>
</li>
</ul>
<br>
</div></body>
</html>
Ich hoffe das hilft Dir weiter....
thunderstorm
ich bekomme das problem nicht gelöst, wie ich zwei "hintergrundbilder" übereinander legen kann. als erstes hintergrundbild habe ich ein "tapetenmuster" darüber soll ein weißer kasten in die mitte der seite, auf dem der eigendliche seiteninhalt stehen soll. also die texte. in dem weißen kasten sind aber sterne. heißt, ich muß ihn als bild nehmen.
so sieht es jetzt aus:
html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html><head>
<link rel="stylesheet"href="abendt_raum_style.css" type="text/css">
<title>abendt_raum</title>
</head>
<body background="hg.jpg"> das ist das tapetenmuster, hat funktioniert
<body>
<div id="zweiterbg"> das ist der weiße kasten, der zeigt sich aber
nur als streifen unter dem h1 und h2 text.<h1>abendt_raum</h1>
<h2>visuelle gestaltung</h2>
<br>
</div></body>
</html>
css:
h1 {
color:black;
letter-spacing:20;
font-family:times, sans-serif; /* Schriftart */
}
h2 {
color:black;
letter-spacing:11;
font-family:times, sans-serif; /* Schriftart */
}
div#zweiterbg { background:url(hintergrundbild.jpg) bottom right no-repeat; width:100%; }
</style>vielen dank für eure hilfe!
-
oh! super! vielen dank! da kämpf ich mich jetzt erst mal durch!
-
scheint anfangs manchmal ein wenig undurchsichtig, ist aber echt ne gute Sache.
Falls DU Fragen hast, ich bin leider momentan nicht so viel im Forum, aber evtl. passt es grad oder du schreibst Deine Emailadresse in eines Deiner Pstings....
Viel Glück (und Spass) ;-)
thunderstormoh! super! vielen dank! da kämpf ich mich jetzt erst mal durch!
-
-