HTML Die Tabelle rutscht immer nach unten?
Hallo!
Ich habe momenatn ein Schulprojekt bei dem ich eine Fahradshop mit html bauen soll. Ich habe Bilder in eine Tabelle hinzugefügt (weil es uns so vorgegeben wurde) was auch ohne Probleme geklappt hat. Danach wollte ich unter der Tabelle einen Strich setzten welcher dann aber über der Tabelle angezeigt wurde.
Hier der Code:
<html>
<title>Fahrrad Verkauf</title>
<head><center>
<img src=leisteprodukte.png usemap="#image-map">
</center>
</head>
<body bgcolor=#CAE1FF><center>
<br><br><br>
<map name="image-map">
<area target="" alt="" title="" href="Produkte.html" coords="3640,911,3974,990" shape="rect">
<area target="" alt="" title="" href="Kaufen.html" coords="4320,990,4039,906" shape="rect">
<area target="" alt="" title="" href="Startseite.html" coords="4390,889,4732,986" shape="rect">
</map>
<map name="1">
<area target="" alt="Trackind Rad1" title="Trackind Rad" href="Fahrrad1.html" coords="2,1,610,610" shape="rect">
</map>
<map name="2">
<area target="" alt="Trackind Rad2" title="Trackind Rad" href="Fahrrad2.html" coords="2,1,610,610" shape="rect">
</map>
<map name="3">
<area target="" alt="Mountainbike1" title="Mountainbike" href="Fahrrad3.html" coords="2,1,610,610" shape="rect">
</map>
<map name="4">
<area target="" alt="Mountainbike2" title="Mountainbike" href="Fahrrad4.html" coords="2,1,610,610" shape="rect">
</map>
<map name="5">
<area target="" alt="City Rad1" title="City Rad" href="Fahrrad5.html" coords="2,1,610,610" shape="rect">
</map>
<map name="6">
<area target="" alt="City Rad2" title="City Rad" href="Fahrrad6.html" coords="2,1,610,610" shape="rect">
</map>
<map name="7">
<area target="" alt="Kinder Rad1" title="Kinder Rad" href="Fahrrad7.html" coords="2,1,610,610" shape="rect">
</map>
<map name="8">
<area target="" alt="Kinder Rad2" title="Kinder Rad" href="Fahrrad8.html" coords="2,1,610,610" shape="rect">
</map>
<br><br><br><br><br><br>
<span style="font-size:70">Drücke auf die Bilder für eine Groß-Ansicht.</span>
<table bordercolor=#6381d8 border=1>
<tr>
<td><img src=Fahrrad1.jpg usemap=#1></td>
<td><img src=Fahrrad2.jpg usemap=#2></td>
<td><img src=Fahrrad3.jpg usemap=#3></td>
<td><img src=Fahrrad4.jpg usemap=#4></td>
</tr>
<tr>
<td><img src=Fahrrad5.jpg usemap=#5></td>
<td><img src=Fahrrad6.jpg usemap=#6></td>
<td><img src=Fahrrad7.jpg usemap=#7></td>
<td><img src=Fahrrad8.jpg usemap=#8></td>
</tr><br>
<hr color=#6381d8 size=10 width=100%>
</body>
</html>
2 Antworten
Es fehlt der schließende table-tag. Wenn du nach dem letzten </tr> noch ein </table> schreibst, müsste es wieder stimmen :D
Edit:
Den hr-Tag solltest du dir auch nochmal angucken. Die styles davon macht man doch anders und entweder mit close-tag oder als 'self closed' tag schreiben.
mein tip , immer sauber coden , heisst erst start und end tag dann informationen rein packen, ggf einrücken . bzw gute IDEs machen das automatisch . z.b. Visual Studio Code.
und nicht 10 BR tags sondern abstand mit div und css , oder generell CSS nehmen .
br tags sind zu vermeiden , die sind nur für textumbruch .
Mal ein TIP
KEINE <br> TAGS sonderm mit CSS den Abstand regeln. <br> tags sind nur für zeilenumbrüche sinnvill und nicht zur gestalltung .
keine <center> TAGS auch hier mit CSS alles regeln .
<img src=leisteprodukte.png usemap="#image-map">
gehört nicht in den HEAD
title gehört in den HEAD
kein <center> im HEAD
also eigentlich hast du da total kaputtes HTML
und eine image map nutz man bei einem bild und nicht auf eine tabelle von bildern , auch das nutzt man schon lange nicht mehr , da gibts einfach andere möglichkeiten .
<a href="zielurl>" alt="Fahhrad 1" title="Kinder Rad" style="text-decoration: none;"><img src="fahrrad1.jpg" /></a>
Das ist wie gesagt nur ein Schulprojelt ich bin in keinster Weise ein Profi. Ich nutze das Wissen was mir mein Lehrer vermittelt hat und der hat uns nun mal <center> und <br> beigebracht.
Die Anforderungen sind halt bei ihm auch nicht groß. Er meint so lange es funktioniert reicht es aus.
Trotzdem danke für deine Hilfe
Ja hat geklappt.
Oh man jetzt habe ich eine Stunde probiert und probiert und dabei war es etwas so offentsichtliches.
Danke!