Lightstorm
New member
Ich habe ein Bild mit dem Photoshop Slice Werkzeug in über 500 Einzelbilder geschnitten. Jetzt will ich sehr viele Bilder daraus auf eine bestimmte Seite verlinken.
Ich will das mit CSS machen da die HTML Datei sehr groß und daher unübersichtlich ist.
Zu beachten ist das die Dateinamen der Bilder, z.B. mainmap2_01.png über PHP oder JavaScript regelmäßig verändert werden um an der Stelle ein anderes Bild einzusetzen, die Seiten Verlinkung auf dem veränderten Bild muss weiterhin bestehen bleiben.
Hier ist ein Beispiel Code, nur kleiner als das original.
Nur weiß ich gerade nicht wie man mit css die Bilder auf eine Seite verlinkt, wie kann ich am besten die Bilder für css Befele selektieren?
Ich will das mit CSS machen da die HTML Datei sehr groß und daher unübersichtlich ist.
Zu beachten ist das die Dateinamen der Bilder, z.B. mainmap2_01.png über PHP oder JavaScript regelmäßig verändert werden um an der Stelle ein anderes Bild einzusetzen, die Seiten Verlinkung auf dem veränderten Bild muss weiterhin bestehen bleiben.
Hier ist ein Beispiel Code, nur kleiner als das original.
Nur weiß ich gerade nicht wie man mit css die Bilder auf eine Seite verlinkt, wie kann ich am besten die Bilder für css Befele selektieren?
Code:
<html>
<head>
<title>mainmap</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<link rel="stylesheet" type="text/css" href="css.css" />
<!-- ImageReady Slices (mainmap.png) -->
<table id="Tabelle_01" width="1283" height="604" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="5">
<img src="Bilder/mainmap2_01.png" width="1282" height="144" alt=""></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="144" alt=""></td>
</tr>
<tr>
<td rowspan="4">
<img src="Bilder/mainmap2_02.png" width="595" height="460" alt=""></td>
<td rowspan="2">
<img src="Bilder/mainmap2_03.png" width="19" height="20" alt=""></td>
<td colspan="3">
<img src="Bilder/mainmap2_04.png" width="668" height="9" alt=""></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="9" alt=""></td>
</tr>
<tr>
<td rowspan="3">
<img src="Bilder/mainmap2_05.png" width="25" height="451" alt=""></td>
<td rowspan="2">
<img src="Bilder/mainmap2_06.png" width="13" height="14" alt=""></td>
<td rowspan="3">
<img src="Bilder/mainmap2_07.png" width="630" height="451" alt=""></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="11" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="Bilder/mainmap2_08.png" width="19" height="440" alt=""></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="3" alt=""></td>
</tr>
<tr>
<td>
<img src="Bilder/mainmap2_09.png" width="13" height="437" alt=""></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="437" alt=""></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>
Zuletzt bearbeitet: