Gestaltung mit iFrame und Tabellen

Jump to last post
Der3Geist

Der3Geist

always feed the fish
Registriert
14 Juli 2013
Beiträge
2.226
Ort
Hessen
Hi,

leider sind meine letzten HTML Versuche doch schon viele Jahre her, und ich hab echt den Überblick verloren.

Ich hatte eigentlich vor, meine Internetseite etwas auf Vordermann zu bringen, doch irgendwie klemmt es schon an der Struktur.

Mein Vorhaben ist, eine Kopfzeile komplett von Links nach recht, und darunter Links eine Menüleiste und rechts daneben der Inhalt.
Nun habe ich gelesen, das man nicht mehr mit Tabellen Arbeiten sollte, weil es Verpönt ist.
Dann hatte ich versucht mit iFrames zu arbeiten, allerdings klappt dies auch nicht so wie es soll.

Der Aufbau sollte wie folgt sein.


web.png

Da ich Grafiken für den Kopf und das Menü habe, sollten die Abstände zwischen den Teilen möglichst 0 Betragen, doch irgendwie funktioniert das nicht.
Und wenn möglich, würde ich das Ganze als iFrame laufen lassen, damit ich die Teile auch austauschen kann.

Meine Bisherigen Versuche.

[src=html4strict]<html>
<head>
<title>test</title>
</head>
<body bgcolor="#ffffff" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">

<table frameborder="0">
<tr frameborder="0">
<td height="54" width="100%">
<iframe src="top.htm" width="100%" height="50" name="iFrameTop" scrolling="no" frameborder="0">
<p>Ihr Browser kann leider keine eingebetteten Frames anzeigen</p>
</iframe>
</td>
</tr>
<tr frameborder="0">
<td height="100%">
<iframe src="left.htm" width="100" height="100%" name="iFrameLeft" scrolling="no" frameborder="0">
<p>Ihr Browser kann leider keine eingebetteten Frames anzeigen</p>
</iframe>
</td>
<td width="100%" height="100%">
<iframe src="http://www.google.de" width="100%" height="100%" name="iFrameData" scrolling="yes" frameborder="0">
<p>Ihr Browser kann leider keine eingebetteten Frames anzeigen</p>
</iframe>
</td>
</tr>
</table>

</body>
</html>[/src]

Was soweit auch funktioniert, aber eben Tabellen verwendet.
Dazu kommt noch, dass zwischen dem Top Frame und dem Left Frame ein paar Pixel spalt sind, welche ich nicht wegbekomme.


web2.png

Nun die Frage, ist es wirklich so schlimm, wenn man Tabellen oder iFrames verwendet?
Und wie bekomme ich den Spalt zwischen Top & Left weg?
 
Der3Geist schrieb:
leider sind meine letzten HTML Versuche doch schon viele Jahre her, und ich hab echt den Überblick verloren.
Zum Vergrößern anklicken....

Meintest Du "viele Jahrzehnte"?

Wo Du scheinbar überhaupt keine Ahnung zu haben scheinst, solltest Du Dir vlt
You do not have permission to view link please Anmelden or Registrieren
und/oder
You do not have permission to view link please Anmelden or Registrieren
mal anschauen.
Wenn Du Seiten "austauschen" willst nimm php include oder eben gleich ein komplettes Content-Management wie Wordpress oder cmsimple.
 
Sowohl Browser als auch Suchmachinen lesen HTML inzwischen so wie es mal gedacht war...
HTML ist ja keine Programmiersprache sondern eine Seitenbeschreibungssprache >> HTML beschreibt WAS der Inhalt der zwischen den dargestellten Flächen steht darstellen soll.

Ist denn das Aussehen deiner Seite eine art Daten-Inhalt die du in Tabellarischer Form präsentieren möchtest? Würdest du das Layout der Seite in Excel tippen?
Ebenso der iFrame > Inhalt der gekapselt (in einem Rahmen) dargestellt werden soll. > Gehört der Inhalt deiner Seite zu deiner Seite oder ist der etwas fremdartiges das nirgends dazu gehört?

Ganz davon abgesehen passen sich sowohl Tabellen als auch iFrames nicht an die Größe des Browser-Fensters an sondern sind erst einmal statisch (Es gibt div. Tricks mit Javascript das zu ändern - das ist aber dann eher: Ich löse mit noch mehr Code ein Problem das ich ohne dieses Konstrukt gar nicht hätte).

Also ob es wirklich so "schlimm" ist - ist wohl Ansichtssache. Aber es ergibt schlicht nicht sonderlich viel Sinn es so zu machen.
Ganz davon abgesehen bist du damit ja auch nicht gerade zum Erfolg gekommen.

[src=html5]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
<title>Simple Layout</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

<style type="text/css" media="screen">
/*<![CDATA[*/
#header {
background: #d7dabd;
}
#container {
width: 100%;
float: left;
margin-right: -200px;
}
#content {
background: #f1f2ea;
margin-right: 200px;
}
#menu {
background: #e5e7d3;
width: 200px;
min-height: 400px;
float: left;
}
#footer {
height: 0px;
clear: both;
}
h1 {
margin-top: 0;
}
.last {
margin-bottom: 0;
}
/*]]>*/
</style>
</head>

<body>
<div id="header">header</div>

<div id="menu">
<h1>sidebar</h1>
<ul>
<li>link one</li>
<li>link two</li>
</ul>
</div>

<div id="container">
<div id="content">
<h1>content</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus varius eleifend tellus. Suspendisse potenti. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Nulla facilisi. Sed wisi lectus, placerat nec, mollis quis, posuere eget, arcu.</p>
<p class="last">Donec euismod. Praesent mauris mi, adipiscing non, mollis eget, adipiscing ac, erat. Integer nonummy mauris sit amet metus. In adipiscing, ligula ultrices dictum vehicula, eros turpis lacinia libero, sed aliquet urna diam sed tellus. Etiam semper sapien eget metus.</p>
</div>
</div>



<div id="footer"></div>

</body>
</html>[/src]

Das sollte dir helfen.
 
  • Thread Starter Thread Starter
  • #4
@Dexter, danke für die Links.

werde sie mir mal im Hinterkopf behalten.
Ich wollte es nicht so umfangreich und komplex machen.


@dr future

Danke, das passt.
Eine einfache Lösung ohne großartig Schnickschnack.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben