Gegen Bilderklau - Das Original (https://www.gegen-bilderklau.net/index.php)
- Design, Website, Copyright (https://www.gegen-bilderklau.net/board.php?boardid=80)
--- Homepagehilfe (https://www.gegen-bilderklau.net/board.php?boardid=27)
---- Tutorials und FAQ (https://www.gegen-bilderklau.net/board.php?boardid=45)
----- [HTML] Table Layout + Iframe (https://www.gegen-bilderklau.net/thread.php?threadid=38859)
Geschrieben von Startpost-Retter am 12.11.2005 um 08:28:
Table Layout + Iframe
So.
Versuche mich auch mal an einem Tutorial.
Hoffe ich erklär es einigermaßen okay.
Ich hab es jetzt bei myblog gemacht, aber ihr könnt es soweit ich weiß auch bei allen anderen Anbietern machen.
So wird das Lay am Ende aussehen -klick-
Zuerst braucht ihr einen Header. Ich hab einen mit der Größe 400 x 600 genommen.
Wenn ihr den habt, könnt ihr anfangen mit dem coden.
Wir machen das jetzt Schritt für Schritt.
1. Schritt
Wenn ihr den Header habt, fügt ihn in folgenden Code ein.
| code: |
1:
|
html><body topmargin=15><center><img src="hier.die.addy.eures.bildes." width="600" height="400" style="border: 1px solid #b3b3b3"></center></body></html> |
|
Die Größe müsst ihr ändern je nach Headergröße. Rand müsst ihr nicht machen, könnt ihr also auf 0px stellen. Hintergrund könnt ihr ja selbst ändern. 'TopMargin' heißt, dass der Header erst bei 15px anfängt, könnt ihn aber auch nach ganz oben oder so setzen, ist ja egal.
2. Schritt
Wenn ihr das habt, könnt ihr das Menü und den Content machen.
| code: |
1:
2:
|
<table width="602" border="1" cellpadding=3 cellspacing=3 style="border-collapse: collapse;" bordercolor="#b3b3b3"><tr><td width="100" align="left" valign="top">*Menü*
</td><td valign="top" width="500">*Content*</td></tr></table> |
|
Rand könnt ihr wieder ändern, die Größe des Contents und des Menüs auch. Schaut nur, dass es die Gesamtweite nicht mehr aus 600px beträgt, da es sonst übersteht. Das
*Menü* ändern wir beim nächsten Schritt, genauso wie das
*Content*.
3. Schritt
Nun kommt der Content dran. Für das
*Content* setzt ihr den folgenden Code ein.
| code: |
1:
|
<iframe src="eure.seite." name="content" frameborder="1" width="500" height="170"></iframe> |
|
Die Breite müsst ihr ggf. ändern, kommt halt auf euer Headerbild an. Eure Seite müsst ihr nur noch ändern und den Namen 'Content' könnt ihr auch ändern, aber dann müsst ihr es auch bei dem Menü machen. Und das beim nächsten Schritt.
4.Schritt
Anstatt dem
*Content* setzen wir jetzt folgenden Code ein.
| code: |
1:
2:
3:
4:
|
<a href="eure zusatzseite" target="content">Link</a><br>
<a href="eure zusatzseite" target="content">Link</a><br>
<a href="eure zusatzseite" target="content">Link</a><br>
<a href="eure zusatzseite" target="content">Link</a><br> |
|
Also immer eure Zusatzseiten. Vergesst auf keinen fall das
Target="content". Wenn ihr den Content oben anders benannt habt, müsst ihr es hier natürlich auch so nennen. Das bezweckt nämlich, dass sich die Seiten auch im Content öffnen. Es ist egal, wieviele Zusatzseiten ihr macht, das Menü wächst ja immer mit.
5. Schritt
So. Eigentlich seid ihr nun fertig.
Jetzt könnt ihr noch CSS anpassen. Also Linkeffekte ect.
Das macht ihr genauso wie bei einem normalen Layout.
So, ich hoffe, es ist kein Fehler drin & ich hab es einigermaßen verständlich erklärt.
Geschrieben von Lilly17 am 18.11.2005 um 15:15:
Hey...
danke für das Tutorial... musste ein bisschen rumprobieren, damit es funktioniert, aber ohne deine Hilfe hätte ich es nicht geschafft, danke
Habe allerdings einen Fehler gefunden
Bei Schritt 4 hast du geschrieben, man solle *Content* ersetzen, es müsste aber *Menü* heißen.
Also, vielen Dank, war gut erklärt und hat super geklappt.
Geschrieben von Sallysha am 22.12.2005 um 15:27:
Echt cool erklärt, klappt alles suer!
Geschrieben von mrs.sun am 12.03.2006 um 11:54:
hä??? bei mir ist das aber dann mit scrollbalken!!!!
Geschrieben von mrs.sun am 14.03.2006 um 14:11:
ok
http://derpferdemarkt.pyrokar.lima-city.de/test.htm
| code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Pferdemarkt</title>
</head>
<body> <left><img src="http://derpferdemarkt.pyrokar.lima-city.de/header.jpg" width="600" height="400" style="border: 1px solid #b3b3b3"><table width="602" border="1" cellpadding=3 cellspacing=3 style="border-collapse: collapse;" bordercolor="#b3b3b3"><tr><td width="100" align="left" valign="top">
<iframe src="http://derpferdemarkt.pyrokar.lima-city.de/menu.htm" name="menu" frameborder="1" width="100" height="170"></iframe>
</td><td valign="top" width="500">
<iframe src="http://derpferdemarkt.pyrokar.lima-city.de/willkommen.htm" name="main" frameborder="1" width="500" height="170"></iframe></td></tr></table>
</body></html>
|
|
Geschrieben von mrs.sun am 14.03.2006 um 17:12:
will uns den keiner helfen????
Geschrieben von mrs.sun am 15.03.2006 um 18:20:
????
Geschrieben von -Katja- am 16.03.2006 um 15:16:
Bei mir ist der auch nur 170 hoch und passt sich net an oO
Aber egal XD
Geschrieben von Vici am 15.04.2006 um 09:49:
Funktioniert astrein, herzlichen dank! (;
Geschrieben von Milka am 17.04.2006 um 21:14:
Meinst du mit Header die Grafik die da oben bei deinem Beispiel desi is wo allein draufsteht?
MILKA
Geschrieben von Runner am 22.06.2006 um 16:08:
| 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:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
|
<html>
<head>
<style>body
{cursor:crosshair};a:hover{cursor:crosshair;}</style>
<style type="text/css">
BODY {
SCROLLBAR-FACE-COLOR: ffffff;
<BR>SCROLLBAR-HIGHLIGHT-COLOR: black;
<BR>SCROLLBAR-SHADOW-COLOR: ffffff;
<BR>SCROLLBAR-3DLIGHT-COLOR: FFFFFF;
<BR>SCROLLBAR-ARROW-COLOR: #ffc8ff;
<BR>SCROLLBAR-TRACK-COLOR: #FFC8FF;
<BR>SCROLLBAR-DARKSHADOW-COLOR: ffffff<BR>}
<!--
A:link {text-decoration: underline; }
A:visited {text-decoration: underline; }
A:hover {text-decoration: underline; position: relative; top: 1; left: 1;}
A:active {text-decoration: none; }
//-->
</style>
<script language="JavaScript">
var message="";
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
</script>
<script language="JavaScript1.2">
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
</script>
<title>tablelay</title>
</head>
<body bgcolor="#000000" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF">
<center>
<table width="772" bordercolor="#FFFFFF" bordercolordark="#FFFFFF">
<tr>
<td width="796" align="left" valign="top" background="menue.jpg" colspan="2">
<p align="center"><font color="#FFFFFF"><img border="0" src="header.png" width="800" height="350"></font></p>
</td>
</tr>
<tr>
<td width="164" align="left" valign="top" background="menue.jpg">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana" size="1">Home</font></b><font face="Verdana" size="1"><br>
<a href="home.htm" target="home" style="text-decoration: none">
Clear</a><br>
<a href="Sonstiges/impressum.htm" target="home" style="text-decoration: none">
Impressum</a><br>
<a href="http://gbweb.de/gb.pl?momentfotos" target="home" style="text-decoration: none">
Gästebuch</a><br>
<a href="Sonstiges/link.htm" target="home" style="text-decoration: none">
Links</a><br>
<br>
<b>Fotografieren</b><br>
<a href="ueber%20mich/sandra.htm" target="home" style="text-decoration: none">
Profil</a><br>
<a href="ueber%20mich/meine_kamera.htm" target="home" style="text-decoration: none">
Ausrüstung</a><br>
<a href="termine.htm" target="home" style="text-decoration: none">
Termine</a><br>
<br>
<b>Bilder<br>
</b><a href="galerie/neuestes_bild.htm" target="home" style="text-decoration: none">Neuestes Bild</a><br>
<a href="galerie/galerie.htm" target="home" style="text-decoration: none">
Galerie</a><br>
<a href="archiv/archiv.htm" target="home" style="text-decoration: none">
Archiv</a><br>
</font></font></td>
<td valign="top" width="632" background="main.jpg">
<p align="center"><font color="#FFFFFF"><br>
</font><font color="#FFFFFF" face="Verdana" size="1"><br>
Ich begrüße sie herzlichst auf meiner Homepage. </font></p>
<p align="center"><font color="#FFFFFF" face="Verdana" size="1">Hier möchte
ich ihnen mein Hobby das Fotografieren näher zeigen. Es ist eines meiner
größten Hobbys,<br>
allerdings habe ich noch sehr wenig Erfahrung mit meiner neuen Kamera.
Trotzdem versuche ich jede Gelegenheit zu packen um mehr Erfahrung mit dem
Umgang dieser Kamera<br>
zu sammeln und bessere Fotos zu machen.<br>
<br>
Schauen sie sich doch etwas um.<br>
</font></p>
<p align="center"><font color="#FFFFFF" face="Verdana" size="1">Sandra
Polanetzki</font>
</td>
</tr>
</table>
</center>
</body>
</html>
|
|
aber es öffnet sich nicht im home frame...und ich weiß nicht wie ich das hinbekomme...
so sieht mein code jetzt aus,aber irgendwie...naja funktioniert das nicht so richtig -.-...ich kriegs einfach net hin...
Geschrieben von SammyLG am 01.07.2006 um 22:30:
Hat sich erledigt.
Geschrieben von Atani am 02.08.2006 um 18:56:
also, bei mir funktioniert das nicht? ich hab immer den Scrollbalken im Iframe und verlängern tun die sich demnach auch nicht
kann mir jemand sagen, wo der Fehler liegt?
| Zitat: |
<html>
<head>
<title> layouttest 1 </title>
</head>
<body bgcolor="#000000">
<body topmargin=15><center><img src="Enter01.jgp" width="480" height="180" style="border: 1px solid #b3b3b3">
<table width="480" border="1" cellpadding=3 cellspacing=3 style="border-collapse: collapse;" bordercolor="#b3b3b3">
<tr>
<td width="100" align="left" valign="top">
<iframe src="menu.htm" name="menu" frameborder="1" width="100" height="170"></iframe></td>
<td valign="top" width="380">
<iframe src="content.htm" name="content" frameborder="1" width="380" height="170"></iframe></td>
</tr>
</table>
</body>
</html>
|
Daran ändert sich auch nichts, wenn ich "height" ändere. Dann sind nur die Frames länger, aber noch immer mit eigenem Scrollbalken.
Hier ein Beispiel -->
klick
Geschrieben von Pöni am 11.08.2006 um 12:33:
hab das selbe problem.
habs gelöst:
| 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:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
|
<html>
<head>
<title>[B]Dein Titel[/B]</title>
</head>
[B]<body topmargin=10 link="#000000" vlink="#000000" alink="#000000">[/B]
<center><img src="[B]http://home.arcor.de/noralien/header.jpg[/B]" width="[B]600[/B]" height="
[B]300[/B]" style="border: 0px solid #ffffff"></center>
<center><table width="602" border="1" cellpadding=3 cellspacing=3 style="border-collapse: collapse;" bordercolor="#ffffff">
<tr>
<td width="150" align="left" valign="top">
<p align="center">
<font color="#000000"> <font size="2">
<a href="Menulink, Z.b. http://home.arcor.de/dein.account.name/home.html"><font face="Arial">Start</font></a><br>
<a href="Menulink, Z.b. http://home.arcor.de/dein.account.name/home.html"><font face="Arial">Start</font></a><br>
<a href="Menulink, Z.b. http://home.arcor.de/dein.account.name/home.html"><font face="Arial">Start</font></a><br>
</font>
</font>
</td>
<td valign="top" width="450">
<font color="#000000">
TEXT IM TEXTFRAME
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
</font>
</td>
</tr>
</table> |
|
Geschrieben von Pöni am 11.08.2006 um 12:55:
| Zitat: |
Original von Pöni
hab das selbe problem.
habs gelöst:
| 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:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
|
<html>
<head>
<title>Dein Titel</title>
</head>
<body topmargin=10 link="#000000" vlink="#000000" alink="#000000">
<center><img src="http://home.arcor.de/noralien/header.jpg" width="600" height="
300" style="border: 0px solid #ffffff"></center>
<center><table width="602" border="1" cellpadding=3 cellspacing=3 style="border-collapse: collapse;" bordercolor="#ffffff">
<tr>
<td width="150" align="left" valign="top">
<p align="center">
<font color="#000000"> <font size="2">
<a href="Menulink, Z.b. http://home.arcor.de/dein.account.name/home.html"><font face="Arial">Start</font></a><br>
<a href="Menulink, Z.b. http://home.arcor.de/dein.account.name/home.html"><font face="Arial">Start</font></a><br>
<a href="Menulink, Z.b. http://home.arcor.de/dein.account.name/home.html"><font face="Arial">Start</font></a><br>
</font>
</font>
</td>
<td valign="top" width="450">
<font color="#000000">
TEXT IM TEXTFRAME
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
Text Text Text Text Text Text Text Text Text Text Text Text Text
</font>
</td>
</tr>
</table> |
|
|
EDIT: nur hab ich jetzt das problem, dass sich die links in einem neuen fenster öffnen -.-
kann mir wer sagen, wo ich das ändern kann?
Geschrieben von Fleur am 20.08.2006 um 13:13:
Hi,
ich hab eine Frage. Bei meinem Design brauch ich jetzt keine BG Farbe bei den Frames sondern n Bild, wie muss ich das einfügen?
Geschrieben von VRH Pferde am 28.08.2006 um 20:18:
hab leider auch das prob. mit den scrollbars und dass es sich net anpasst
Geschrieben von Audrey am 29.08.2006 um 21:27:
Bei mir ist der Scrollbalken auch da... wieso?
Forensoftware: Burning Board, entwickelt von WoltLab GmbH