Grafiken als Tabellenhintergrund

cycro · 11.01.2006, 19:51

Hi
Leute hab ein Problem.... und zwar wird mir meine Grafik nich als hintergrund angezeigt .... was kann ich da machen

meiner meinung nach hab ichs genau wie bei self HTML gemacht

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//dtd HTML 4.0//EN//">

<HTML>
	
<HEAD> <TITLE> Tabelle </TITLE> </HEAD>

<BODY>
	
<TABLE BORDER="1">
		
<TR>
				
<TD WIDTH="780" HEIGHT="130" STYLE="background-image:header.gif">TEST</TD>
				
</TR>
			
</TABLE>	
					
</BODY>

</HTML>

Die grafik ist im gleichen ordner wie die HTML datei von daher kann es ja eigentlich kein Ziel fehler sein oder ?

satre · 11.01.2006, 19:56

Versuchs mal so:

<td width="100" height="50" background="bild.jpg"></td>

SonKite · 11.01.2006, 19:58

Versuchs mal mit:

style="background-image: url(header.gif);"

steffenk · 11.01.2006, 20:01

gewöhn Dir am besten gar nicht die Grossschreibweise an - die ist veraltet und ab xhtml sogar verboten.
Besser ist es eh, das auszulagern:

<td class="mitbild">...</td>

im CSS:

td.mitbild {width:780px;height:130px;background: url(header.gif);}

Das war auch Dein Fehler - Bilder werden mit url(...) angegeben.

[DerToni] · 11.01.2006, 20:03

Zitat:

Zitat von cycro

...hab ichs genau wie bei self HTML gemacht...

Hallo.

Sicher?

HTML-Code:

<td style="background-image:url(background.jpg)">Test</td>

Gruß
Toni

p.s. Hossa! Ein wahres Antwotgewitter! Und ich war letzter *schnief*

cycro · 11.01.2006, 20:10

THX ich probier mal durch

@[DerToni]

ich dachte man muss das "url" mit der URL austauschen und die () wären nur ein beispiel ^^

@St@eff.en

ok höhr ich halt auf groß zu schreiben

@SonKite und Satre
THX gehen beide ich denk mal ich nehm das kürzere also das

<td width="100" height="50" background="bild.jpg"></td>

SonKite · 11.01.2006, 20:15

Nimm lieber die Lösung von St@eff.en, hast du es später einfacher wenn du mal was ändern willst. Vor allem wenn du evt. mehrer Zeilen mit einem Hintergrundbild hast.

cycro · 11.01.2006, 20:21

ok danke euch ... bis zum nächsten Problem

cycro · 11.01.2006, 20:51

hmm was hab ich denn jetzt falsch gemacht

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//dtd HTML 4.0 //EN//">

<html>
	
<head> 
<title> Tabelle </title> 
<style type="text/style"> 
td.header {width:780px;height:130px  ;background-image:url(img\header.gif);}
td.navigation {width:240px;height:442px  ;background-image:url(img\navi_back.gif);}
td.content {width:540px;height:441px  ;background-image:url(img\content_back.gif);}
</style>
</head>

<body>
	
<table border="1">
<tr>
<td colspan=2><div class="header">&nbsp</div></td>
</tr>

<tr>
<td><div class="navigation">&nbsp</div></td>
<td><div class="content">&nbsp</div></td>
</tr>
</table>	
					
</body>

</html>

321 · 12.01.2006, 00:19

/ statt \ im url()

SonKite · 12.01.2006, 00:28

Die "divs" kannst du auch weglassen, gib die class doch einfach im <td> Tag selbst an (siehe das Beispiel von Steffen).

cycro · 12.01.2006, 12:23

ok so gehts jetzt erstmal ...ich hab kleinere fehler wegbekommen

so ist der code jetzt

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//dtd HTML 4.0 //EN//">

<html>
	
<head> 
<title> Tabelle </title> 
<style type="text/css"> 
td.header {width:780px;height:130px;background-image:url(./header.gif)}
td.navigation {width:240px;height:442px;background-image:url(./navi_back.gif)}
td.content {width:540px;height:441px;background-image:url(./content_back.gif)}
</style>
</head>

<body>
	
<table border="0">
<tr>
<td colspan=2 class="header">&nbsp</td>
</tr>

<tr>
<td class="navigation">&nbsp</td>
<td class="content">&nbsp</td>
</tr>
</table>	
					
</body>

</html>

jetzt werden die Hintergründe angezeigt aber es sind lücken zwischen den grafiken ... wie bekomm ich die weg ?

EDIT: habs geschaft mit <table style="border-spacing:0px">

321 · 12.01.2006, 22:25

padding und margin generell auf null setzen!

Am Anfang der Styles mal folgendes einsetzen:

HTML-Code:

* {margin: 0; padding: 0;}

body,html {margin: 0; padding: 0;}

cycro · 13.01.2006, 21:20

Zitat:

Zitat von 321

padding und margin generell auf null setzen!

Am Anfang der Styles mal folgendes einsetzen:

HTML-Code:

* {margin: 0; padding: 0;}

body,html {margin: 0; padding: 0;}

THX

satre · 13.01.2006, 21:31

Kleine Zwischenfrage:

Wo ist genau der Unterschied zwischen diesen beiden Methoden:

<td width="100" height="50" background="bild.jpg"></td>
<td width="100" height="50" style="background-image:url(bild.jpg)"></td>

Golive generiert automatisch die erste Variante.