yourWBB | HTML, XHTML, JavaScript & CSS | html Docu mit Bildern gesucht

yourWBB » yourWBB Misc * » Das Proggen » HTML, XHTML, JavaScript & CSS » html Docu mit Bildern gesucht

» Hallo Gast [Anmelden|Registrieren]

Letzter Beitrag | Erster ungelesener Beitrag

2.846 Views | | Thema zu Favoriten hinzufügen

Neues Thema erstellen Antwort erstellen

html Docu mit Bildern gesucht

Autor

Beitrag

« Vorheriges Thema | Nächstes Thema »

energun222 energun222 ist männlich

Mitglied

Dabei seit: 10.06.07
Beiträge: 102
Fähigkeiten: WBB2 Anfänger
Herkunft: Deutschland
Forenversion: 2.3

html Docu mit Bildern gesucht

Antworten Zitieren Editieren Melden UP

Hallo,

hab mal ein paar Fragen an die html Kenner geschockt

Und zwar brauche ich ein html Dokument welches wie folgt aufgebaut sein sollte. Ist jetzt nur ein Beispiel

1.)

Überschrift (bekomme ich gerade so noch hin)

2.)

einen Balken sollte sich meiner HP anpassen länge des Balkens sollte man selber bestimmen können (siehe Bild 1)

3.)

mehrere kleine Vorschaubilder wo man bei jedem Bild einen kleinen Text drüber schreiben kann beim klicken auf dieses kleine Vorschaubild soll sich dann das große Bild öffnen

4.)

unter der Bilderreinfolge sollte man noch einen Text schreiben können und das ganze sollte nacher in etwa so aussehen (siehe Bild 2).

Was habe ich vor?

Ich haben einen Spieleclan wo das Spiel cod2 und später auch CoD4 gezockt wird. Dort hat man mehrere Areale auch genannt Maps die wollte ich eben durch dieses Dokument vorstellen sodas Besucher/Gäste meiner HP sich auch ein Bild von dem machen können um was es hier geht.

Kann mir da bitte jemand helfen oder weiß wie man sowas macht?

Gruss

Dateianhänge:

1.jpg (5 KB, 69 mal heruntergeladen)
gif

sosollesaussehen.gif (8 KB, 72 mal heruntergeladen)

__________________
My YouTube### My Website

03.10.07 22:43

E-Mail WWW Finden Als Freund hinzufügen

[kamui]
~

Dabei seit: 27.04.05
Beiträge: 2.992

Antworten Zitieren Editieren Melden UP

Also so wie das im Anhang aussieht, habe ich dir mal einen HTML-Code erstellt.

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:

<table>
  <tr>
    <td colspan="3" align="left">
      Hier die Map oder Mapname
    </td>  
  </tr>
  <tr>
    <td>
      <img src="BILD_1" />
    </td>
    <td>
      <img src="BILD_2" />
    </td>
    <td>
      <img src="BILD_3" />
    </td>
  </tr>
  <tr>
    <td colspan="3" align="left">
      Hier ne kleine Beschreibung zu der spielenden Map!
    </td>  
  </tr>
</table>

03.10.07 22:49

Finden Als Freund hinzufügen

energun222 energun222 ist männlich

Mitglied

Dabei seit: 10.06.07
Beiträge: 102
Fähigkeiten: WBB2 Anfänger
Herkunft: Deutschland
Forenversion: 2.3

Themenstarter Thema begonnen von energun222

Antworten Zitieren Editieren Melden UP

Nabend,

ist noch nicht ganz das was ich suche. Es soll zb. ein kleines Vorschau Bild sein zb. 170x128 beim draufklicken auf dieses soll das richtige Bild in richtiger Größe erscheinen. Mit Balken meine ich zb. eine kleine Grafik die man beschriften kann.

EDIT1:

Mein Code sieht bisher so aus..

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
        <title>Clanregeln</title>
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
        <style type="text/css">
            body {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                 
                color: #000; 
                font-size: 12px;
                margin: 0px; 
                padding: 0px;
            }
        </style>
    </head>
    <body>

<h1 style="color: #FF3333;"><center>Serverregeln</center></h1>
<br /><br />
<br /><br />
<center>
<table>
  <tr>
    <td colspan="3" cellpadding="4" align="left">
      Hier die Map oder Mapname
    </td>  
  </tr>
<tr>
<td>
      <a href="cod2_ferfurious1g.jpg" target="_blank"><img src="cod2_ferfurious1g_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="cod2_ferfurious1g.jpg" target="_blank"><img src="cod2_ferfurious1g_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="cod2_ferfurious1g.jpg" target="_blank"><img src="cod2_ferfurious1g_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
  </tr>
  <tr>
    <td colspan="3" align="left">
      Hier ne kleine Beschreibung zu der spielenden Map!
    </td>  
  </tr>
</table>
</center>
</body>
</html>

Aber es fehlt jetzt noch was und habe noch ein paar Fragen wei ldes habe ich auf selfhtml nit gefunden.

1.)

wie bekomme ich zwischen Mapname mit eventueller kleiner Grafik und den Bildern die unten drunter sind mehr Abstand gleiche Frage auch für Bilder zur Beschreibung dort müsste man auch mehr Abstand bekommen.

2.)

Wie bekomme ich zwischen den Bildern mehr Abstand?

Gruss

EDIT2:

alle Fragen vorher sind bearbeitet großes Grinsen

nun hab ich aber eine neue Frage:

Jetzt schaut der Code so aus nur ein teil davon

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
        <title>Clanregeln</title>
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
        <style type="text/css">
            body {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                 
                color: #000; 
                font-size: 12px;
                margin: 0px; 
                padding: 0px;
            }
        </style>
    </head>
    <body>

<h1 style="color: #FF3333;"><center>Call of Duty 2 Maps</center></h1>
<br /><br />
<br /><br />
<center>
<table>
  <tr>
    <td colspan="3" cellpadding="4" align="left">
      Beltot
<br /><br />
    </td>  
  </tr>
<tr>
    <td>
      <a href="beltot/1.jpg" target="_blank"><img src="beltot/1_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/2.jpg" target="_blank"><img src="beltot/2_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/3.jpg" target="_blank"><img src="beltot/3_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
</tr> 
<tr>
    <td>
      <a href="beltot/4.jpg" target="_blank"><img src="beltot/4_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/5.jpg" target="_blank"><img src="beltot/5_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/cod2beltot.jpg" target="_blank"><img src="beltot/cod2beltot_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
</tr>
  <tr>
    <td colspan="3" align="left">
      Hier ne kleine Beschreibung zu der spielenden Map!
    </td>  
  </tr>

wie bekomme ich denn dort wo Beltot steht eine Grafik hin? (siehe Bild 3)

Ich möchte gerne diese Grafik (siehe Bild 4) über die Vorschaubilder haben, nur wenn ich die einfüge verschiebt sich alles.

Weiß jemand Rat?

Gruss

Dateianhänge:

ohne_Grafik.jpg (57 KB, 53 mal heruntergeladen)
gif

balken_cod2.gif (7,07 KB, 48 mal heruntergeladen)

__________________
My YouTube### My Website

Dieser Beitrag wurde 2 mal editiert, zum letzten Mal von energun222: 04.10.07 03:18.

03.10.07 23:08

E-Mail WWW Finden Als Freund hinzufügen

Schweinebacke Schweinebacke ist männlich

Mitglied

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

Antworten Zitieren Editieren Melden UP

was genau verschiebt sich da?

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
        <title>Clanregeln</title>
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
        <style type="text/css">
            body {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;

                color: #000;
                font-size: 12px;
                margin: 0px;
                padding: 0px;
            }
        </style>
    </head>
    <body>

<h1 style="color: #FF3333;"><center>Call of Duty 2 Maps</center></h1>
<br /><br />
<br /><br />
<center>
<table>
  <tr>
    <td colspan="3" cellpadding="4" align="left">
   <img src="beltot/0.jpg" border="0" width="500" height="20" alt="bild" /></td>
  </tr>
<tr>
    <td>
      <a href="beltot/1.jpg" target="_blank"><img src="beltot/1_k.jpg" border="0" width="170" height="128" alt="bild" /></a></td>
    <td>
      <a href="beltot/2.jpg" target="_blank"><img src="beltot/2_k.jpg" border="0" width="170" height="128" alt="bild" /></a></td>
    <td>
      <a href="beltot/3.jpg" target="_blank"><img src="beltot/3_k.jpg" border="0" width="170" height="128" alt="bild" /></a></td>
</tr>
<tr>
    <td>
      <a href="beltot/4.jpg" target="_blank"><img src="beltot/4_k.jpg" border="0" width="170" height="128" alt="bild" /></a></td>
    <td>
      <a href="beltot/5.jpg" target="_blank"><img src="beltot/5_k.jpg" border="0" width="170" height="128" alt="bild" /></a></td>
    <td>
      <a href="beltot/cod2beltot.jpg" target="_blank"><img src="beltot/cod2beltot_k.jpg" border="0" width="170" height="128" alt="bild" /></a></td>
</tr>
  <tr>
    <td colspan="3" align="left">
      Hier ne kleine Beschreibung zu der spielenden Map!</td>
  </tr>

04.10.07 09:23

E-Mail Finden Als Freund hinzufügen

energun222 energun222 ist männlich

Mitglied

Dabei seit: 10.06.07
Beiträge: 102
Fähigkeiten: WBB2 Anfänger
Herkunft: Deutschland
Forenversion: 2.3

Themenstarter Thema begonnen von energun222

Antworten Zitieren Editieren Melden UP

Wenn ich diesen langen Balken da einfüge mit diesem Code...

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
        <title>Clanregeln</title>
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
        <style type="text/css">
            body {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                 
                color: #000; 
                font-size: 12px;
                margin: 0px; 
                padding: 0px;
            }
        </style>
    </head>
    <body>

<h1 style="color: #FF3333;"><center>Call of Duty 2 Maps</center></h1>
<br /><br />
<br /><br />
<center>
<table>
  <tr>
    <td>
      <img src="balken/balken_cod2.gif" />
    </td>
</tr>
<tr>
    <td colspan="3" cellpadding="4" align="left">
      Beltot
<br /><br />
    </td>  
  </tr>
<tr>
    <td>
      <a href="beltot/1.jpg" target="_blank"><img src="beltot/1_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/2.jpg" target="_blank"><img src="beltot/2_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/3.jpg" target="_blank"><img src="beltot/3_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
</tr> 
<tr>
    <td>
      <a href="beltot/4.jpg" target="_blank"><img src="beltot/4_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/5.jpg" target="_blank"><img src="beltot/5_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/cod2beltot.jpg" target="_blank"><img src="beltot/cod2beltot_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
</tr>
  <tr>
    <td colspan="3" align="left">
      Hier ne kleine Beschreibung zu der spielenden Map!
    </td>  
  </tr>

würde das dann so aussehen.

Dateianhang:

auseinander.jpg (57,05 KB, 36 mal heruntergeladen)

__________________
My YouTube### My Website

04.10.07 12:12

E-Mail WWW Finden Als Freund hinzufügen

bossi

Mitglied

Dabei seit: 14.12.05
Beiträge: 202
Forenversion: 3.0; 2.3

Antworten Zitieren Editieren Melden UP

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
        <title>Clanregeln</title>
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
        <style type="text/css">
            body {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                 
                color: #000; 
                font-size: 12px;
                margin: 0px; 
                padding: 0px;
            }
        </style>
    </head>
    <body>

<h1 style="color: #FF3333;"><center>Call of Duty 2 Maps</center></h1>
<br /><br />
<br /><br />
<center>
<table>
  <tr>
    <td colspan="3">
      <img src="balken/balken_cod2.gif" />
    </td>
</tr>
<tr>
    <td colspan="3" cellpadding="4" align="left">
      Beltot
<br /><br />
    </td>  
  </tr>
<tr>
    <td>
      <a href="beltot/1.jpg" target="_blank"><img src="beltot/1_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/2.jpg" target="_blank"><img src="beltot/2_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/3.jpg" target="_blank"><img src="beltot/3_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
</tr> 
<tr>
    <td>
      <a href="beltot/4.jpg" target="_blank"><img src="beltot/4_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/5.jpg" target="_blank"><img src="beltot/5_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
    <td>
      <a href="beltot/cod2beltot.jpg" target="_blank"><img src="beltot/cod2beltot_k.jpg" border="0" width="170" height="128" alt="bild"></a>
    </td>
</tr>
  <tr>
    <td colspan="3" align="left">
      Hier ne kleine Beschreibung zu der spielenden Map!
    </td>  
  </tr>

Mit diesem Code sollte es gehen

Edit: Der Teil ist neu:
<td colspan="3">
<img src="balken/balken_cod2.gif" />
</td>

__________________
www.Virtual-Orgasm.de

Dieser Beitrag wurde 1 mal editiert, zum letzten Mal von bossi: 04.10.07 13:37.

04.10.07 13:26

E-Mail Finden Als Freund hinzufügen

energun222 energun222 ist männlich

Mitglied

Dabei seit: 10.06.07
Beiträge: 102
Fähigkeiten: WBB2 Anfänger
Herkunft: Deutschland
Forenversion: 2.3

Themenstarter Thema begonnen von energun222

Antworten Zitieren Editieren Melden UP

Funktioniert Prima!

EDIT: ..::Hier::.. könnt Ihr es euch anschauen wie es aussehen soll und auch tut dank euch!

Danke euch allen Ehren

__________________
My YouTube### My Website

Dieser Beitrag wurde 1 mal editiert, zum letzten Mal von energun222: 04.10.07 18:27.

04.10.07 13:41

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 » html Docu mit Bildern gesucht