PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Bilder referenzieren (War: Ich hab mir eine)

HiddenGhost
2003-06-28, 18:13:37
Ich will mir endlich html beibringen, aber richtiges und sauberes coden... also hab ich mir gedacht, gleich mit stylesheets lernen.
Die VOrteile sollten eigentlich den zusätzlichen Aufwand überwiegen...

Ich aber ein Problem, wieso kann ich nichtmal ein Hintergrundbild referenzieren?
Ich hab eine externe css-Datei erstellt mit dem Inhalt

body { background: #aaaaaa url(../graphic/background.png) repeat fixed; }

Der Code der HP sieht bisher wie folgt aus
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="SHORTCUT ICON" href="./bilder/mein_favicon.ico">
<title>Grundgerüst Alpha</title>
<link rel="stylesheet" type="text/css" href="./format.css">
</head>
<body style:url(../bilder/background.png)>
</body>
<tr>
<td>
</td>
</tr>
</html>
mictasm
2003-06-28, 18:29:21
Der richtige Aufruf für ein Hindergrundbild lautet "background-image" und hat mit der Hintergrundfarbe ("background-color") nichts zu tun.

Hier noch ein Link, der dir weiterhelfen wird: http://selfhtml.teamone.de/navigation/css.htm

Viel Spass weiterhin!

Gruss,

MIC
HiddenGhost
2003-06-28, 18:35:54
Original geschrieben von mictasm
Der richtige Aufruf für ein Hindergrundbild lautet "background-image" und hat mit der Hintergrundfarbe ("background-color") nichts zu tun.

Hier noch ein Link, der dir weiterhelfen wird: http://selfhtml.teamone.de/navigation/css.htm


Dieser Code funktioniert auch nicht... es wird immer noch nichts geladen.
body { background-image:url(../bilder/background.png); background-repeat; }

Hier (http://selfhtml.teamone.de/css/eigenschaften/hintergrund.htm#background) sagen die aber, dass ich mit dem bisherigen Code richtig liege... indem ich in der css datei alle shintereinander notiere...
Matthias2x
2003-06-28, 19:12:32
Original geschrieben von HiddenGhost
Dieser Code funktioniert auch nicht... es wird immer noch nichts geladen.
body { background-image:url(../bilder/background.png); background-repeat; }

Hier (http://selfhtml.teamone.de/css/eigenschaften/hintergrund.htm#background) sagen die aber, dass ich mit dem bisherigen Code richtig liege... indem ich in der css datei alle shintereinander notiere...

versuchs mal so:

body { background-image:url('bilder/background.png'); background-repeat:no-repeat;}
Black-Scorpion
2003-06-28, 19:21:13
Schau mal auf diese Seite.

http://www.drweb.de
HiddenGhost
2003-06-28, 19:36:45
Ich glaub ich mach etwas falsch beim Anlegen der externen css-Datei. Wenn ich den Code in der jew. Htmlseite scheibe funzt es mit dem Bild, sobald ich aber mit <link ref="stalesheet"... > auf ein externes Stylesheet zugreifen will, wird der Hintergrund nicht mehr angezeigt...
Black-Scorpion
2003-06-28, 20:31:17
Original geschrieben von HiddenGhost
Ich glaub ich mach etwas falsch beim Anlegen der externen css-Datei. Wenn ich den Code in der jew. Htmlseite scheibe funzt es mit dem Bild, sobald ich aber mit <link ref="stalesheet"... > auf ein externes Stylesheet zugreifen will, wird der Hintergrund nicht mehr angezeigt...

Das funktioniert unter Windows nicht.


falsch : <link rel="stylesheet" type="text/css" href="./format.css">

richtig (selber Ordner): <link rel="stylesheet" type="text/css" href="format.css">
richtig (anderer Ordner): <link rel="stylesheet" type="text/css" href="css/format.css">
HiddenGhost
2003-06-28, 21:09:23
Original geschrieben von Anonym_001
Das funktioniert unter Windows nicht.


richtig (selber Ordner): <link rel="stylesheet" type="text/css" href="format.css">
richtig (anderer Ordner): <link rel="stylesheet" type="text/css" href="css/format.css">


So sieht das doch bei mir aus... guck doch mal oben in den Code.
Ich mache scheinbar etwas falsch in der externes css datei. Könnte mir jemand mal einmal den kompletten code wie ich ihn brauche aufschreiben...

btw. mods... korregiert ihr mir bitte, bitte den threadtitel... BIIIIIIITTE
HiddenGhost
2003-06-28, 21:26:22
btw. den Hintergrund der erscheinen soll wird jezz erstmal an dieses Posting gehängt. Dieser liegt ohn eweiteres Unterverzeichnis im Ordner bilder (s.o.).
Ich verstehe nicht, warum mein Code falsch ist, sodass nicht angezeigt wird...

ich weiß, man kommt später mit einr viel kleineren Datei aus, aber so kann ich das direkt kontrollieren...
Black-Scorpion
2003-06-28, 21:27:49
Original geschrieben von HiddenGhost
So sieht das doch bei mir aus... guck doch mal oben in den Code.


Der Code ist von dir.
Aber es gibt einen Unterschied. Habe es jetzt mal hervorgehoben.


falsch : <link rel="stylesheet" type="text/css" href="./format.css">

richtig (selber Ordner): <link rel="stylesheet" type="text/css" href="format.css">
richtig (anderer Ordner): <link rel="stylesheet" type="text/css" href="css/format.css">
HiddenGhost
2003-06-28, 21:32:12
und wo ist der Unterschied...

ob ich nun ./apfel.jpg oder apfel.jpg schreibe... im Endeffekt ist das das gleiche.. und ich hab an dieser stelle schon herum probiert. Nur warum wird kein hintergrund angezeigt.
Black-Scorpion
2003-06-28, 21:36:23
falsch: body { background-image:url(../bilder/background.png); background-repeat; }
richtig: body { background-image:url(bilder/background.png); background-repeat; }


So sollte es funktionieren.
Black-Scorpion
2003-06-28, 21:47:43
Original geschrieben von HiddenGhost
und wo ist der Unterschied...

ob ich nun ./apfel.jpg oder apfel.jpg schreibe... im Endeffekt ist das das gleiche.. und ich hab an dieser stelle schon herum probiert. Nur warum wird kein hintergrund angezeigt.

Das ist ein großer Unterschied.

apfel.jpg schreibt man wenn die Datei im selben Ordner wie die .html Datei ist.

Ordner/apfel.jpg wenn sich die Datei in einem anderen Ordner befindet.
HiddenGhost
2003-06-28, 21:58:41
Original geschrieben von Anonym_001

falsch: body { background-image:url(../bilder/background.png); background-repeat; }
richtig: body { background-image:url(bilder/background.png); background-repeat; }


So sollte es funktionieren.

eben nicht... so hab ich das schon seit einiger Zeit drin stehen in der css-Datei... meine index.html macht das aber nicht!

edit: Das Problem tritt nur bei Opera auf... wieso werden aber die Hintergrundbilder anderer Seiten angezeigt, die auf gleiche Weise in das Stylesheet eingebunden wurden ???
Black-Scorpion
2003-06-28, 22:29:45
Body {background-image: url(bilder/background.png);}


Versuch es mal ohne "background-repeat", kann sein das es Opera nicht mag.
HiddenGhost
2003-06-28, 22:38:18
hab ich schon probiert...
smallB
2003-06-29, 00:28:14
opera mag kein css
HiddenGhost
2003-06-29, 08:47:08
So funzt das jetzt:

body {
background: #ffffe0 url(./bilder/background.png) repeat ;
}



<html>
<head>
<title>Grundgerüst Alpha</title>
<link rel="stylesheet" type="text/css" href="format.css">
<body>
</body>
</head>
</html>

Ich hatte die ganze Zeit den Bodytag übersehen...
HiddenGhost
2003-06-29, 13:22:41
Neues Problem:

Ich hab das tabellen Layout prwobeweise vorbereit. Ich versuche einzelne Elemente der Menüs mit Hintergründen zu versehen, klappt aber nicht so wie es soll: Ich finde den Fehler einfach nicht.


body
{ background: #ffffe0 url(./bilder/background.png) repeat ;
}

#menu1 { background: #ffffff ; }

#menu2 { background: url(./bilder/menu2bg.png) repeat ; }





<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Grundgerüst Alpha</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" type="text/css" href="format.css">
</head>

<body>
<table border="1" cellpadding="0" cellspacing="0" width="80%" style="menu1" align="center">
<tr colspan="5">
<td>Seitenlogo</td>
</tr>
<tr>
<td>
<table border="1">
<colgroup>
<col width="150">
<col width="15">
<col width="70%">
<col width="15">
<col width="150">
</colgroup>
<tr>
<div id="menu1">
<td>
<table border=1 width="100%" valign="top">
<tr>
<td>Home</td>
</tr>
<td>Menü<br>punkte mit<br>s.sheet menu2</td>
<tr>
<td>Community</td>
</tr>
<tr>
<td>Kontakt</td>
</tr>
</table>
</td>
</div>
<td></td>
<td>
<table border="1" width="100%">
<tr heigh="15">
<td>.</d>
<td>.</d>
<td>.</d>
</tr>
<tr heigh="15">
<td>.</d>
<td>.</d>
<td>.</d>
</tr>
<colgroup>
<col width="50%">
<col width="25">
<col width="50%">
</colgroup>
<tr>
<td>test <p>test <p>test <p>test <p>test <p>test <p>test <p>test <p>test <p>test <p>test</td>
<td>.</td>
<td>.</td>
</tr>
</table>
</td>
<td></td>
<td>rechte<p>Leiste</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Black-Scorpion
2003-06-29, 15:21:51
Habe den Code mal geändert.
Kopiere ihn mal in eine neue Datei und teste es mal.
Die beide div- tags habe ich raus genoomen, da es so nicht funktioniert.
Die anderen Änderungen habe ich hervorgehoben.


<style type="text/css">
<!--
body { background: #ffffe0 url(./bilder/background.png) repeat;}
.menu1 { background: #ffffff; }
.menu2 { background: url(./bilder/menu2bg.png) repeat ; }
-->
</style>


<html>
<head>
<title>Grundgerüst Alpha</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" type="text/css" href="format.css">
</head>
<body>
<table border="1" cellpadding="0" cellspacing="0" width="80%" class="menu1" align="center">
<tr colspan="5">
<td>Seitenlogo</td>
</tr>
<tr>
<td>
<table border="1">
<colgroup>
<col width="150">
<col width="15">
<col width="70%">
<col width="15">
<col width="150">
</colgroup>
<tr>
<td>
<table border=1 width="100%" valign="top">
<tr>
<td class="menu1">Home</td>
</tr>
<td class="menu2">Menü<br>punkte mit<br>s.sheet menu2</td>
<tr>
<td>Community</td>
</tr>
<tr>
<td>Kontakt</td>
</tr>
</table>
</td>
<td>
</td>
<td>
<table border="1" width="100%">
<tr heigh="15">
<td>.</d>
<td>.</d>
<td>.</d>
</tr>
<tr heigh="15">
<td>.</d>
<td>.</d>
<td>.</d>
</tr>
<colgroup>
<col width="50%">
<col width="25">
<col width="50%">
</colgroup>
<tr>
<td>test <p>test <p>test <p>test <p>test <p>test <p>test <p>test <p>test <p>test <p>test</td>
<td>.</td>
<td>.</td>
</tr>
</table>
</td>
<td></td>
<td>rechte<p>Leiste</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
HiddenGhost
2003-06-29, 23:23:54
Wo kann ich nachlesen, was ich wann wo wie zu benutzen habe bei style sheets. class ist IMO auch neu für mich...

btw. bis ich das alles geschnallt habe, nennt mich ruhig "html-lamer"... ich habs verdient ;D
Black-Scorpion
2003-06-29, 23:28:41
Geh auf diese Seite, da findest du vieles zu HTML und CSS.

http://www.drweb.de