1. Liebe Forumsgemeinde,

    aufgrund der Bestimmungen, die sich aus der DSGVO ergeben, müssten umfangreiche Anpassungen am Forum vorgenommen werden, die sich für uns nicht wirtschaftlich abbilden lassen. Daher haben wir uns entschlossen, das Forum in seiner aktuellen Form zu archivieren und online bereit zu stellen, jedoch keine Neuanmeldungen oder neuen Kommentare mehr zuzulassen. So ist sichergestellt, dass das gesammelte Wissen nicht verloren geht, und wir die Seite dennoch DSGVO-konform zur Verfügung stellen können.
    Dies wird in den nächsten Tagen umgesetzt.

    Ich danke allen, die sich in den letzten Jahren für Hilfesuchende und auch für das Forum selbst engagiert haben. Ich bin weiterhin für euch erreichbar unter tti(bei)pcwelt.de.
    Dismiss Notice

Bild in den Hintergrund rücken

Discussion in 'Web-Know-how für die Homepage' started by $hade, Feb 3, 2008.

Thread Status:
Not open for further replies.
  1. $hade

    $hade Byte

    Hi,

    ich habe ein Design für meine Website in Photoshop gestaltet und anschliesend gesliced. Wenn ich nun in Dreamweaver die .html Datei öffne und in den Content-Bereich was schreiben möchte verschiebt sich leider alles, da man ja nicht auf Bildern schreiben kann. Wie lautet den der Code damit sich das eine Bild in den Hintergrund verschiebt und ich drüber schreiben kann? ("Bilder/Index_27.gif")

    Mein Aufbau in HTML:

    Code:
    <html>
    <head>
    <title>Index</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">
    <!-- ImageReady Slices (Index.psd) -->
    <table id="Tabelle_01" width="1280" height="1025" border="0" cellpadding="0" cellspacing="0">
    	<tr>
    		<td colspan="17">
    			<img src="Bilder/Index_01.gif" width="1280" height="113" alt=""></td>
    	</tr>
    	<tr>
    		<td colspan="10">
    			<img src="Bilder/Index_02.gif" width="644" height="1" alt=""></td>
    		<td rowspan="2">
    			<img src="Bilder/Index_03.gif" width="154" height="43" alt=""></td>
    		<td rowspan="3">
    			<img src="Bilder/Index_04.gif" width="18" height="56" alt=""></td>
    		<td rowspan="2">
    			<img src="Bilder/Index_05.gif" width="102" height="43" alt=""></td>
    		<td colspan="4">
    			<img src="Bilder/Index_06.gif" width="362" height="1" alt=""></td>
    	</tr>
    	<tr>
    		<td colspan="2" rowspan="2">
    			<img src="Bilder/Index_07.gif" width="177" height="55" alt=""></td>
    		<td>
    			<img src="Bilder/Index_08.gif" width="95" height="42" alt=""></td>
    		<td rowspan="2">
    			<img src="Bilder/Index_09.gif" width="28" height="55" alt=""></td>
    		<td>
    			<img src="Bilder/Index_10.gif" width="88" height="42" alt=""></td>
    		<td rowspan="2">
    			<img src="Bilder/Index_11.gif" width="19" height="55" alt=""></td>
    		<td>
    			<img src="Bilder/Index_12.gif" width="120" height="42" alt=""></td>
    		<td rowspan="2">
    			<img src="Bilder/Index_13.gif" width="20" height="55" alt=""></td>
    		<td>
    			<img src="Bilder/Index_14.gif" width="81" height="42" alt=""></td>
    		<td rowspan="2">
    			<img src="Bilder/Index_15.gif" width="16" height="55" alt=""></td>
    		<td rowspan="2">
    			<img src="Bilder/Index_16.gif" width="17" height="55" alt=""></td>
    		<td>
    			<img src="Bilder/Index_17.gif" width="155" height="42" alt=""></td>
    		<td colspan="2" rowspan="2">
    			<img src="Bilder/Index_18.gif" width="190" height="55" alt=""></td>
    	</tr>
    	<tr>
    		<td>
    			<img src="Bilder/Index_19.gif" width="95" height="13" alt=""></td>
    		<td>
    			<img src="Bilder/Index_20.gif" width="88" height="13" alt=""></td>
    		<td>
    			<img src="Bilder/Index_21.gif" width="120" height="13" alt=""></td>
    		<td>
    			<img src="Bilder/Index_22.gif" width="81" height="13" alt=""></td>
    		<td>
    			<img src="Bilder/Index_23.gif" width="154" height="13" alt=""></td>
    		<td>
    			<img src="Bilder/Index_24.gif" width="102" height="13" alt=""></td>
    		<td>
    			<img src="Bilder/Index_25.gif" width="155" height="13" alt=""></td>
    	</tr>
    	<tr>
    		<td rowspan="2">
    			<img src="Bilder/Index_26.gif" width="172" height="855" alt=""></td>
    		<td colspan="15">
    			<img src="Bilder/Index_27.gif" width="935" height="795" alt=""></td>
    		<td rowspan="2">
    			<img src="Bilder/Index_28.gif" width="173" height="855" alt=""></td>
    	</tr>
    	<tr>
    		<td colspan="15">
    			<img src="Bilder/Index_29.gif" width="935" height="60" alt=""></td>
    	</tr>
    	<tr>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="172" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="5" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="95" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="28" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="88" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="19" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="120" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="20" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="81" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="16" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="154" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="18" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="102" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="17" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="155" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="17" height="1" alt=""></td>
    		<td>
    			<img src="Bilder/Abstandhalter.gif" width="173" height="1" alt=""></td>
    	</tr>
    </table>
    <!-- End ImageReady Slices -->
    </body>
    </html>
     
  2. spain9

    spain9 Kbyte

    in CSS gibts die Eigenschaft z-index.
    du musst deinen bildern einen kleineren z-index geben als dem text.
    weißt du wie du CSS in deinen Code einfügst??
     
  3. $hade

    $hade Byte

    ja schon aber ich hab ehrlich gesagt noch nie was von z-index gehört :o
     
  4. kalweit

    kalweit Hüter der Glaskugel

  5. $hade

    $hade Byte

    @ kalweit: müsste ich dann nich einfach

    <img src="Bilder/Index_27.gif" width="935" height="795" alt="">

    durch

    <body style="background-image:url(Bilder/Index_27.gif)" width="935" height="795" alt="">

    ersetzten? klappt jedenfalls nicht, das design verschiebt sich dann.
     
  6. spain9

    spain9 Kbyte

    du musst statt "body" "div" schreiben.
     
  7. kalweit

    kalweit Hüter der Glaskugel

    ...nö! Ich habe "Zellenhintergrund" in #4 geschrieben und es auch so gemeint.
     
  8. $hade

    $hade Byte

    funktioniert leider alles nicht...kann mir vll. jemand einfach den richtigen code in meine html datei einsetzten (siehe #1)?

    habs auch mal mit:

    <td style="background-image:url(Bilder/Index_27.gif);">

    probiert aber dann verschiebt sich auch alles...
     
  9. kalweit

    kalweit Hüter der Glaskugel

    ...wenn du mal drüber nachdenkst, kommst du auch drauf warum. Kleiner Tipp: von einem Hintergrund kann nur so viel sichtbar sein, wie das Element in dem er sich befindet Platz einnimmt.
     
  10. $hade

    $hade Byte

    leider nicht. wäre dir sehr dankbar wenn du mir einfach die lösung sagen würdest ;)
     
Thread Status:
Not open for further replies.

Share This Page