Newskästen in HTML definieren

Status
Nicht offen für weitere Antworten.

nexius

Grünschnabel
hallo Community,

Ich habe folgende Webseite mit Photoshop erstellt:

http://www.raucherinsel.de/try/raucherinsel.gif

Nur schaffe ich es in HTML nicht, die beiden Newskästchen in jeweils separaten HTML-Seiten (bsp. news1.html, news2.html) so zu bauen, dass sie erstens nur so groß wie die Kästchen und genau an dieser Stelle sind - umgeben von meinem mühsam erstellten Layout versteht sich.

Habt ihr vielleicht Hilfe auf Lager.

nexius
 
Hallo,

damit du die beiden Newskästen in eingeständige HTML Dateinen unterbringen kannst, musst du mit IFrames und vorzugsweise Tabellen arbeiten...

Infos Iframe: http://selfhtml.teamone.de/html/frames/eingebettete.htm
Infos Tabellen: http://selfhtml.teamone.de/html/tabellen/aufbau.htm#definieren

Die Tabelle solltest du dann in etwa so auf´bauen wie auf dem Bild (ist aber eine ganz grobe Skizze)...

iframe.jpg


ciao
 
Hallo.

Danke für Deine Hilfe, nur komme ich so recht auch nicht weiter.
Das layout habe ich mit Image Ready zerlegt - bereits wie du sagtest, um die Buttons als einzelne Slices und auch die beiden Kästchen als separate Grafiken zu erhalten. Und wie ich den Quellcode verstehe (der automatisch generiert wurde), habe ich bereits eine riesige Tabelle vor mir, in der ich jetzt mit dem iframe herumexperimentier.

An dieser Stelle müsste der iframe rein:

<TR>
<TD>
<IMG SRC="Bilder/index_63.jpg" WIDTH=28 HEIGHT=339 ALT=""></TD>
<TD COLSPAN=7>
<IMG SRC="Bilder/index_64.jpg" WIDTH=436 HEIGHT=339 ALT=""></TD>

Nur wie???
 
Original geschrieben von nexius
Hallo.

Danke für Deine Hilfe, nur komme ich so recht auch nicht weiter.
Das layout habe ich mit Image Ready zerlegt - bereits wie du sagtest, um die Buttons als einzelne Slices und auch die beiden Kästchen als separate Grafiken zu erhalten. Und wie ich den Quellcode verstehe (der automatisch generiert wurde), habe ich bereits eine riesige Tabelle vor mir, in der ich jetzt mit dem iframe herumexperimentier.

An dieser Stelle müsste der iframe rein:

<TR>
<TD>
<IMG SRC="Bilder/index_63.jpg" WIDTH=28 HEIGHT=339 ALT=""></TD>
<TD COLSPAN=7>
<IMG SRC="Bilder/index_64.jpg" WIDTH=436 HEIGHT=339 ALT=""></TD>

Nur wie???

PHP:
<TR>
<TD>
<iframe name="links" src="xxx.html"></iframe>
</TD>
<TD COLSPAN=7>
<iframe name="rechts" src="yyy.html"></iframe>
</TD>
 
Danke.

Jetzt habe ich die zwei iframes vor mir, die ich in separaten HTML-Dateien erstelle, gell?

Mein erstes Ergebnis sieht so aus:

http://www.raucherinsel.de/Try/raucherinsel2.gif

Was habe ich in der Tabelle falsch gemacht, sodass das Bild als Hintergrund nicht an den Ecken des Kästchens anliegt?

Hier der Code:

<table border="0" width="436" height="339" style="background-image:url(bilder/index_64.jpg)">
<tr>
<td>

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

Vermute aber mal, dass ich beim Einbinden der iframes in die index.html etwas falsch gemacht habe, oder?

Hier der Code:

<TD COLSPAN=7>
<iframe src="news.html" scrolling="auto" style="width:436; height:339;"></iframe></TD>
 
Hallo,

das ist leider zu wenig Info - häng mal die Bilder und die HTML Datei an, dann können wir dir weiterhelfen - rein vom Code her ist´s OK...


ciao
 
ich habe es soweit hinbekommen. Gefehlt hat lediglich border="0" frameborder="0".

Nächstes Problem: ich will die Scrollbars in meinem iframe in einer anderen Farbe glänzen lassen. Der Code ist mir geläufig, nur wo muss er hin. Es wird immer geschrieben, dass der Code in den Head der Hauptzeile gehört. Dort klappts aber bei mir nicht.

Wer weiß rat? Der Code lautet:

<STYLE type="text/css">
<!--
BODY {
scrollbar-face-color:#008000;
scrollbar-highlight-color:#8080FF;
scrollbar-3dlight-color:#0000A0;
scrollbar-darkshadow-color:#408080;
scrollbar-shadow-color:#00FFFF;
scrollbar-arrow-color:#FFFF80;
scrollbar-track-color:#8080C0;
}
-->
</STYLE>
 
Der Code passt soweit. Er gehört in den Head-Bereich der Seite, die im Frame geladen werden soll (wenns mehrere sind, muss es in alle). Also angenommen im Frame wie die Datei "News.html" geladen, dann muss in "News.html" follgendes rein:

PHP:
<html>
<head>
<STYLE type="text/css"> 
<!-- 
BODY { 
scrollbar-face-color:#008000; 
scrollbar-highlight-color:#8080FF; 
scrollbar-3dlight-color:#0000A0; 
scrollbar-darkshadow-color:#408080; 
scrollbar-shadow-color:#00FFFF; 
scrollbar-arrow-color:#FFFF80; 
scrollbar-track-color:#8080C0; 
} 
--> 
</STYLE>
</head>
<body>
...


ciao
 
Hmm, klappt nicht.

Mein zuladener iframe mit dem eingefügten Style:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<STYLE type="text/css">
<!--
BODY {
scrollbar-face-color:#008000;
scrollbar-highlight-color:#8080FF;
scrollbar-3dlight-color:#0000A0;
scrollbar-darkshadow-color:#408080;
scrollbar-shadow-color:#00FFFF;
scrollbar-arrow-color:#FFFF80;
scrollbar-track-color:#8080C0;
}
-->
</STYLE>
<title>Text des Titels</title>
</head>
<body>

<table border="0" width="431" height="336" scrolling="yes" style="background-image:url(bilder/index_22.jpg)">

<tr>
<td>

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

</body>
</html>
 
Doch muss und wird klappen - habs extra getestet... Welchen Browser verwendest du? Farbige Scrollbalken sind Internet Explorer (ab 5.0?) only - mit Opera, Netscape, Konqueror, Mozilla usw wird sich nix ändern...

//edit: Das "scrolling="yes" " hat in der Tabelle nix verloren... Wenn dann in den Body...

//edit2: mach mal soviel Inhalt rein, dass du auch Scrollen musst :)
 
Zuletzt bearbeitet:
Status
Nicht offen für weitere Antworten.
Zurück