YourWBB


yourWBB » yourWBB Misc * » Das Proggen » HTML, XHTML, JavaScript & CSS » Grafik auf Grafik legen? » Hallo Gast [Anmelden|Registrieren]
Letzter Beitrag | Erster ungelesener Beitrag 2.788 Views | | Thema zu Favoriten hinzufügen

Neues Thema erstellen Antwort erstellen

Zum Ende der Seite springen Grafik auf Grafik legen?
Autor
Beitrag « Vorheriges Thema | Nächstes Thema »
Barthez
Mitglied


Dabei seit: 07.07.04
Beiträge: 304
Forenversion: 3.0

Fragezeichen Grafik auf Grafik legen? Antworten Zitieren Editieren Melden       UP

Hi Leute,

ich möchte links eine Grafik haben und rechts Text ... das klappt auch ganz gut (bei Fehlern im folgenden Code bitte unbedingt posten)

<html>
<head>
<title>Testseite</title>
<meta name="author" content="Sascha">
</head>
<b><font><br /><h1><img src="images/index_skyscraper.gif" width="100" height="800" align="left" vspace="10" hspace="20" alt="Aktionsfläche">Textüberschrift</h1>
<p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</p>
</body>
</html>

Wie schaffe ich es nun auf die linke Grafik mehrere kleine zu legen ... das index_skyscraper.gif, soll also der Untergrund für andere Grafiken sein?

Hoffe ich habe mich nicht allzu doof ausgedrückt ... ich danke für Eure Zeit!

__________________
Gruß
Barthez
06.01.07 13:33 Barthez ist offline E-Mail WWW Finden Als Freund hinzufügen
Indeep Indeep ist männlich
Mitglied


Dabei seit: 26.08.04
Beiträge: 419
Herkunft: Berlin
Forenversion: 2.3

Antworten Zitieren Editieren Melden       UP

in dem du die "linke Grafik" als Background legst, damit kannste die andere grafik dann normal drüberlegen
06.01.07 13:44 Indeep ist offline E-Mail Finden Als Freund hinzufügen
MonsterOfRock
Gesperrt! 10/04/07


Dabei seit: 04.11.05
Beiträge: 690

Antworten Zitieren Editieren Melden       UP

Versuchs mal damit :

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
</head>

<body>
<table cellpadding="0" cellspacing="0" border="0">
 <tr>
  <td style=" width:100px; height:800px; background-image: url(images/index_skyscraper.gif); background-repeat:no-repeat">
   // Hier Grafiken einfügen
  </td>
  <td valign="top">
   <h1>Textüberschrift</h1>
   <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</p>
  </td>
 </tr>
</table>  
</body>
</html>
06.01.07 13:46 MonsterOfRock ist offline Finden Als Freund hinzufügen
Barthez
Mitglied


Dabei seit: 07.07.04
Beiträge: 304
Forenversion: 3.0

Themenstarter Thema begonnen von Barthez
Antworten Zitieren Editieren Melden       UP

danke sehr


ok es geht jetzt alles ... wie schaffe ich es die Bilder die auf der Backgroundgrafik liegen vertikal auszurichten? Sie liegen zwar drauf fangen aber erst recht weit unten auf dem Background an ... deswegen ist die unterste Grafik auch schon nicht mehr auf dem Background drauf, sondern lapt unten über!

Hier nochmal der Code wie er jetzt ist


<table cellpadding="3" cellspacing="0" border="0">
<tr>
<td style=" width:100px; height:850px; background-image: url(images/index_skyscraper.gif); background-repeat:no-repeat">
<a href="link"><img src="images/index_1.gif" alt="index1.gif" border="0" width:50px; height:150px; vspace="3"></a>
<a href="link"><img src="images/index_2.gif" alt="index2.gif" border="0" width:50px; height:150px; vspace="3"></a>
<a href="link"><img src="images/index_3.gif" alt="index3.gif" border="0" width:50px; height:150px; vspace="3"></a>
<a href="link"><img src="images/index_4.gif" alt="index4.gif" border="0" width:50px; height:150px; vspace="3"></a>
<a href="link"><img src="images/index_5.gif" alt="index5.gif" border="0" width:50px; height:150px; vspace="3"></a>
</td>
<td valign="top">
<p><font size="+1">Textüberschrift</b></font></p
<p>Text</p>
</td>
</tr>
</table>

__________________
Gruß
Barthez

Dieser Beitrag wurde 3 mal editiert, zum letzten Mal von Barthez: 06.01.07 18:18.

06.01.07 14:01 Barthez ist offline E-Mail WWW Finden Als Freund hinzufügen
Donkman Donkman ist männlich
Mitglied


images/avatars/avatar-4686.gif

Dabei seit: 28.03.05
Beiträge: 466
Forenversion: 2.3; Lite 1.0

Antworten Zitieren Editieren Melden       UP

ich weiss ja nicht wie weit das "recht weit unten" ist, aber mit dem cellpadding="3" sagste deiner tabelle schon den inhalt 3px vom rand wegzusetzen. Augenzwinkern

__________________
Zwei Dinge sind unendlich: Das Universum und die menschliche Dummheit
.....beim Universum bin ich mir allerdings nicht so sicher.(Albert Einstein)
07.01.07 14:33 Donkman ist offline E-Mail WWW Finden Als Freund hinzufügen
Barthez
Mitglied


Dabei seit: 07.07.04
Beiträge: 304
Forenversion: 3.0

Themenstarter Thema begonnen von Barthez
Antworten Zitieren Editieren Melden       UP

ja klar 3px horizontal ... ich bemängele aber die vertikale Ausrichtung ... Augen rollen

zu sehen ist das ganze unter [URL][/URL] auf der linken mittleren Seite ... da sind jetzt so kleine Bildchen drauf und die starten nicht oben wo der Background anfängt sondenr bestimmt 3 oder 4 cm zu weit unten und stehen deswegen auch über den Background nach unten über!.

ja ich weiß ist kein WBB "Problem", aber zu HTML paßte es hier eben grade und da ich weiß wie schnell und gut manchen hier helfen können habe ich mich entschlossen hier zu fragen!

__________________
Gruß
Barthez

Dieser Beitrag wurde 1 mal editiert, zum letzten Mal von Barthez: 15.02.07 17:23.

07.01.07 15:39 Barthez ist offline E-Mail WWW Finden Als Freund hinzufügen
Schweinebacke Schweinebacke ist männlich
Mitglied


images/avatars/avatar-5303.jpg

Dabei seit: 06.01.06
Beiträge: 826
Herkunft: Baden Württemberg

Antworten Zitieren Editieren Melden       UP

Schreibe mal in die Zelle valign="top" mit rein oder in das css vertical-align:top;.

Die Tabelle sieht dann so aus:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
<table cellpadding="3" cellspacing="0" border="0">
 <tr>
  <td style=" width:100px; height:850px; background-image: url(images/index_skyscraper.gif); background-repeat:no-repeat; vertical-align:top;">

    <a href="link?osCsid=536677d70386753584ff121a43e9928f"><img src="images/index_1.jpg" alt="CL-Sieger" border="0" width="94" height="150" vspace="3"></a>
         <a href="link?osCsid=536677d70386753584ff121a43e9928f"><img src="images/index_banner.jpg" alt="SELLS-Shop.de" border="0" width="94"; height="300" vspace="3"></a>
             <a href="link?osCsid=536677d70386753584ff121a43e9928f"><img src="images/index_2.jpg" alt="der Prototyp" border="0" width="94" height="150" vspace="3"></a>
                <a href="link?osCsid=536677d70386753584ff121a43e9928f"><img src="images/index_3.jpg" alt="schottischer Meister" border="0" width="94" height="150" vspace="3"></a>
</td>
  <td valign="top">
   <p><font size="+1"><b>Ist SELLS der Rolls Royce unter den Torwarttextilien?</b></font></p
   <p><b>Qualitativ ist SELLS mit Sicherheit eine Topmarke, die vor allem in England, Schottland und Wales von den dortigen Profitorhütern getragen wird.<br /><br />Der SELLS-Shop.de bringt diese Top-Marke nun nach Deutschland ohne übermässig lange Lieferzeiten, überzogene Preise, oder viel zu hohe Versandkosten!<br /><br />Zeigen Sie ihren Torwartkollegen und vor allem den gegnerischen Keepern und Stürmern, dass Sie sich mit diesem Topmaterial von der Masse abheben. Treten Sie mit mehr Selbstbewusstsein auf, immer nach dem Motto: "an mir musst Du erstmal vorbei".<br /><br />Adam Sells und Chris Taylor gründeten im November 2001 die Firma und Marke SELLS (SGP), die Grundidee war bei höchster Qualität auf die speziellen Bedürfnisse des modernen Torwarts einzugehen ... anschliessend ging alles ganz schnell:<br /><br />Schon im Februar 2002 trug der damalige Keeper von Charlton bei einer Liveübertragung des Meisterschaftsspiels gegen Middlesbrough Handschuhe der Marke SELLS.<br /><br />Im März 2002 wurde Celtic Glasgow schottischer Meister. Celtic Keeper Robert Douglas hebt die Meisterschale mit SELLS-Handschuhen in den Himmel!<br /><br />Im Mai 2005 gewinnt Jerzey Dudek den wichtigsten europäischen Vereinswettbewerb, die Champions League .. in SELLS-Handschuhen!<br />Noch im gleichen Monat gewinnen SELLS-Keeper alle 3 englischen Playoff-Pokale und Ronald Waterreus holt die schottische Meisterschaft ... allesamt in SELLS-Handschuhen!<br /><br /><br />Sollten Sie offene Fragen, Anregungen oder auch Kritik zu den SELLS Produkten, oder dem SELLS-Shop.de selbst haben melden Sie sich per <a href="mailto:support@sells-shop.de"><b>E-MAIL</b></a> oder rufen Sie mich einfach unter <b>02305 / 352652</b> an. Ich erwarte Ihren Anruf.<br /><br />Ihr Sascha Oezer<br />SELLS-Shop.de, spezialisiert auf Sells Goalkeeper Products.<br /><br /></b></p>

  </td>
 </tr>
</table>


Die Größenangaben der Bilder habe ich gleich berichtigt.

Nicht so width:94px; height:150px;

Sondern so width="94" height="150"

Oder so style=" width:94px; height:150px;“

Den Rahmen um das Bild auf Null gesetzt. Da es ein Link ist, bekommt der eventuell sonst eine andere Farbe.
07.01.07 17:00 Schweinebacke ist offline E-Mail Finden Als Freund hinzufügen
Barthez
Mitglied


Dabei seit: 07.07.04
Beiträge: 304
Forenversion: 3.0

Themenstarter Thema begonnen von Barthez
Antworten Zitieren Editieren Melden       UP

alles paletti, danke

__________________
Gruß
Barthez
07.01.07 21:06 Barthez ist offline E-Mail WWW Finden Als Freund hinzufügen
Baumstruktur | Brettstruktur
Gehe zu:

Neues Thema erstellen Antwort erstellen

yourWBB » yourWBB Misc * » Das Proggen » HTML, XHTML, JavaScript & CSS » Grafik auf Grafik legen?