Problem beim Einbinden von Bildern in HTML

togeto · 19. Mai 2010

Hallo liebe Forengemeinde,

ich habe neulich angefangen mich mit HTML zu befassen u. befinde mich auch momentan noch in der übungsphase. nun habe ich versucht nach anleitung eben ein bild einzufügen mit dem code

Code

<img src="" border="" height="" width="" alt="" />

was ich dann eben auch geamcht habe

Code

<img src="html-seminar.jpg" width="474"
   height="66" border="1" alt="jetzt HTML lernen" />

beim validieren sagt der mir dann das das attribut border nciht geht . und egal welches bild ich auch immer nehme es kommt am ende immer nur der rahmen mit den maßen und ein rotes kreuz . nun frage ich mich was ich falsch geamcht habe . ich bin mir ziemlich sicher das es nur ein kleiner dummer fehler ist,aber es nervt trotzdem

hier der komplette code ( nur Übung anch tutorial):

HTML

<!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="de" lang="de">




<head>
    <title>wilkommen-auf-meiner-homepage.htm </title>
    <a href="index.htm">Startseite</a>
    <a href="ueber-mich.htm">&Uuml;ber mich</a>
    <a href="meine-hobbies.htm">Meine Hobbies</a>
    <h1>
       <b>Willkommen auf meiner Homepage</b>
    </h1>
    <h2>Inhalt</h2>
    <ol>
        <li>&Uuml;ber mich</li>
        <li>Meine Hobbies</li>
    </ol>
       <img src="html-seminar.jpg" width="474"
   height="66" border="1" alt="jetzt HTML lernen" />




</head>




<body>




</body>
</html>

Alles anzeigen

ps: das bild ist auch im selben ordner wie der rest.

ich bedanke mich schonmal für jegliche hilfe .

lauras · 19. Mai 2010

Hi,

erstmal zu dem border-Problem:
Das Attribut "border" ist im Strict-Doctype, den du hier verwendet, deprecated (missbilligt). Warum?
Formal sollte immer eine Trennung zwischen Inhalt und Design vorgenommen werden; border formatiert jedoch etwas, und das machst du über CSS, z.B. so:

Code

img {
border: none;
}

Zur Vervollständigung: der Transitional-Doctype erlaubt das border-Attribut sowie auch einige andere Attribute, die eigentlich nicht mehr benutzt werden sollten. Besser zum Lernen finde ich ist aber der Strict-Doctype.

Zum zweiten Problem:
Alles, was direkt bei dir auf der Seite angezeigt werden soll, kommt zwischen <body> und </body>. Das heißt das ganze müsste so aussehen:

HTML

<!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="de" lang="de"> 




<head> 
    <title>wilkommen-auf-meiner-homepage.htm </title> 
</head> 




<body>
<a href="index.htm">Startseite</a> 
    <a href="ueber-mich.htm">&Uuml;ber mich</a> 
    <a href="meine-hobbies.htm">Meine Hobbies</a> 
    <h1> 
       <b>Willkommen auf meiner Homepage</b> 
    </h1> 
    <h2>Inhalt</h2> 
    <ol> 
        <li>&Uuml;ber mich</li> 
        <li>Meine Hobbies</li> 
    </ol> 
       <img src="html-seminar.jpg" width="474" 
   height="66" border="1" alt="jetzt HTML lernen" /> 




</body> 
</html>

Alles anzeigen

Kleine Anmerkung:
Ich weiß nicht wie es im Seminar steht, aber das <b> im h1 Tag solltest du - wenn man ganz genau ist - auch weglassen, da du auch damit das Aussehen veränderst (besser über CSS). Aber vielleicht kommt das ja später noch.

Viel Spaß & Erfolg noch beim Lernen

Laura

togeto · 19. Mai 2010

danke für den hinweis mit dem body. ich hab das jetz geändert,aber leider erkenn cih das bild immer noch cniht man erkennt wieder nur den bereich ,wo das bild erscheinen soll,aber das bild selbst nciht. wieder nur das rote kreuz

Sarkkan · 19. Mai 2010

Liegt das Bild vielleicht in einem anderen Verzeichnis?
<img src="html-seminar.jpg"...
setzt voraus, dass dort wo die HTML Datei ist auch das Bild, mit genau dem Namen + Typ zu finden ist.

Wenn das Bild in Ordnern liegt, die unter dem Ordner mit der HTML-Datei sind, setzt man '.' und '/'.
Zum Beispiel:
Eigene Datei -> Webdesign -> index.html (in diesem Fall unsere HTML-D.)
Eigene Datei -> Bilder -> html-seminar.jpg (in diesem Fall unser Bild)
möchten wir nun auf das Bild zugreifen müssen wir den Pfad dieser Datei angeben. Dazu könnten wir entweder den genauen Pfad ( C:/User/... bzw. <a class="postlink" href="http://www">http://www</a>. ... allerdings ungeschickt, da man dann den Pfad wenn man die Seite hoch lädt ändern muss, in die http-Version) oder aber einen Pfad von der Datei aus benutzen.
in diesem Fall wäre dies: ../Bilder/html-seminar.jpg
der erste Punkt ist das eigene Verzeichnis, der zweite Punkt gibt an, ein Verzeichnis weiter runter zu gehen.
Würden wir weitere Punkte hinzufügen, so würde jeder weitere Punkt ein Verzeichnis tiefer bedeuten.

(Hoffe hab jetzt keine Fehler rein gebracht und es auch anstdnig und verständlich erklärt^^)

togeto · 19. Mai 2010

ahhhh ich habs jetz
das bild war wirklich nicht in dem ordner. ich muss das wieder gelöscht haben,denn ich bin mir sicher das es gestern ncoh drinne war . naja war bestimmt ein mix aus zei fehlern zum einen der falsche bereich in dem ich das bild rein geschrieben habe und jetz,dass das bild nicht merh da war

ich bedanke mich bi euch beiden für die hilfe

Problem Gelöst !

Problem beim Einbinden von Bildern in HTML

Jetzt mitmachen!

Teilen