Powerpoint in HTML darstellen?

raffael1001

Ich habe in Medientechnik die Aufgabe eine Powerpoint-Präsentation in HTML darstellen. Ein paar Grundlagen beherrsche ich schon, ich habe dazu auch die Seite http://www.w3schools.com verwendet, nur stehe ich vor ein paar kleinen Problemen. Ich schaffe es nicht den Hintergrund von Powerpoint(habe ich zuvor ausgeschnitten) so in die HTML einzusetzen, dass sie in den Hintergrund verschoben wird, sodass ich mit Text darüberschreiben kann, so wie es in der Powerpoint zu lesen ist. Zudem weiß ich nicht, wie man Links schön untereinander angeordnet direkt neben einem Bild darstellen kann. Mein Freund hat mir erzählt, dass man dazu Tabellen nutzen muss, nur wissen wir beide nicht wie genau und was genau man schreiben muss, damit die Tabelle auch passt. Also falls ihr mir einmal Grundlegend bei diesem Problem helfen könnt, oder ihr bereits Ausdrücke wisst, die ich später dann brauchen werde, bitte ich euch reinzuschreiben.
Hier einmal meinen bis jetzt geschriebenen Text im Editor:

HTML

<html>
<head>
<title>Selbstpräsentation</title>
</head>


<body style="background-color:blue">


<center><h1 style="font-family: verdana">Selbstpräsentation <br/>von <br/> Tomesek Raffael</h1></center>
<br/><br/>
<center>
<td><h2><a href="\MEDT\HTML_Selbstpräsentation\Ich in 15 Jahren.html">Ich in 15 Jahren</a></h2></td>
</center>
<table>
<tr>
<td><h2><a href="\MEDT\HTML_Selbstpräsentation\Steckbrief.html">Steckbrief</a></h2></td>
<center>
<td><img src="Raffael_Tomesek(komprimiert).jpg" border="0" width="304" height="228"></td>
</center>
</tr>
</table>
<img src="Foliendesign.png" align="bottom">
<td style="background-image;Foliendesign.png;;">hier dann der text</td>


</body>
</html>

Alles anzeigen

jojo87

Hm, also ich kenne ja nun die Aufgabenstellung nicht genau, aber du könntest dir mal http://slideshare.net ansehen.

sejuma

Mir ist die Aufgabenstellung ebenfalls unklar.
Wenn du verschiedene Powerpointfolien als HTML-Website darstellen sollst, dann musst die entsprechende HTML-Seiten coden. Also so darstellen, dass die den Folien zumindest annhähernd entsprechen.

Dein gepostetes Codebeispiel hat mehrere Fehler:
Es fehlt ein standardkonformer Doctype.
Du verwendest veraltete Tags wie z.B. "center".
Stxleangabe sollte man in eine externe CSS-Datei auslagern.
Der korrekte Tabellensyntax wird nicht eingehalten: Jede Tabelle besteht aus table, tr und td. In dieser Reihenfolge sind die Tags immer zu öffnen und der zuletzt geöffnete Tag dann zuerst zu schließen.
Unabhängig davon solltest du auf Tabellen für das Layout gänzlich verzichten.
Zeichne die verwendeten Elemente semantisch korrekt aus und formatiere sie mit CSS.
Für eine Navigation mit verschiedenen Links verwendet man üblicherweise keine Tabelle, sondern eine ul-Liste.
Ein Basismenü findest du hier: http://www.ohne-css.gehts-gar.net/0072.php

Fazit: Du benötigst Grundkenntnisse in HTML und CSS, um die Aufgabe standardkonform anzugehen.

raffael1001

Wisst ihr wie ich es schaffe dieses Hintergrundbild auf eine gewisse Größe zu begrenzen, denn jedes mal wenn ich die Seite öffne weitet sie sich auf die ganze Website auf:

<html>
<head>
<style type="text/css">
body {background-image:url('Foliendesign.png');
background-position:left top;
}
</style>
</head>

<body>
<h1>Hello World!</h1>
</body>

</html>

Ericfischer

im CSS gibt es "repeat" das kannst du horizontal und vertikal festlegen (x-repeat; y-repeat).
In deinem Fall ausschalten: ->

HTML

<style type="text/css">
body {
background-image:url('Foliendesign.png') no-repeat;
background-position:left top;
}
</style>