nicht angemeldet
Oh, hab vergessen sie alle wegzumachen. Ich habe nämlich immer die bestimmten HTML-Befehle von dieser Seite in meine Seite rüberkopiert.
Die Grundlagen sind mir schon klar.Aber wie bekomme ich diesen Abstand zwischen dem Logo und dem Hintergrund weg?
Hallo Natalie,
sorry klingt vielleicht hart aber Du hast eben _keine_ Grundstruktur in deinem code. Du versuchst zu rennen, bevor du laufen kannst.
Also bitte mal [Link: http://de.selfhtml.org/html/allgemein/grundgeruest.htm] reinziehen. Gaaaaaaaaaaaaanz wichtig auch die Angabe des DOCTYPE [Link: http://de.selfhtml.org/html/allgemein/grundgeruest.htm#dokumenttyp] denn ohne diesen ist ein validieren nicht möglich, auch wenn der restliche Code völlig korrekt sein sollte.
Entgegen der SELFHTML Grundsätze hab ich deinen code jetzt mal ein wenig verbessert und hab meine schlauen :o) Kommentare direkt reingeschrieben:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Emma Watson</title>
<!-- Die Angabe der "character sets" ist ebenfalls wichtig, sowohl für die korrekte Anzeige als auch für die Validierung -->
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<!-- Hier im head gehöhrt die style definition hin -->
<style type="text/css">
body {margin-left:150px;}
p,div,table,ul,ol { margin-left:180px; }
</style>
</head>
<body style="background-color:#A9CAE6" text="#ffffff" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<!-- Die Angabe der text und linkfarbe ist so zwar nicht falsch, aber nicht optimal. Verwende auch hier CSS -->
<!-- Gaaaaaaaaaanz kniffelig. zwischen dem Bild <img src.....> und dem <div style="EmmaStyle/backg.....> darf im Quelltext NICHTS sein. Kein Leerzeichen, kein Zeilenvorschub ABSOLUT NICHTS sonst gibt es wieder einen kleinen Abstand. AUSPROBIEREN! -->
<img src="EmmaStyle/2.Logo.jpg" width="700" height="255" border="0" alt=""><div style="EmmaStyle/background-image:url(2.Background.jpg); background-repeat:repeat-y; margin:0px; font-size:150%;">
<p style="margin-top:0px;padding-top:10px">hallo</p>
<!-- Noch was kniffeliges der Absatz <p> erzeugt einen Absatz... äääh logisch oder? Daher kommt dann allerdings die große Lücke zwischen Bild und Hintergrund. Desshalb wird der obere Abstand hier mit margin-top:0px auf null gesetzt. Willst du nicht, daß der Text ganz oben klebt, kannst du ihn mit padding-top:10px wieder runterschieben. AUSPROBIEREN!-->
<h1>Eine Überschrift erster Ordnung</h1>
<p>Ein Textabsatz, nochmals weiter eingezogen.</p>
<p>Noch einer davon.</p>
<h2>Eine Überschrift zweiter Ordnung</h2>
<ul>
<li>Ein Listenpunkt</li>
<li>Noch ein Listenpunkt</li>
</ul>
<p>TEST<br>TESTTESTTESTETSTS<br>TESTETSTETSTETSTS<br>TESTETETSTETE</p>
</div> <!-- Das div wieder schließen nicht vergessen! -->
</body>
</html>
Also jetzt sollte es einigermaßen so wie gewünscht angezeigt werden.
Allerdings würde ich nicht einfach dem body ein margin-left geben, sondern die Grafik und das div einfach horizontal zentrieren, dann sieht es auch bei verschieden großen Fenstergrößen gut aus.
Schöne Grüße,
TeraVolt