Bild einfügen

Diskutiere Bild einfügen im HTML Forum im Bereich Programmierung; Hallo, ich bin ganz neu im Forum….habe angefangen mit einem html-online-kurs…. ich habe mir als Programm Visual Studio Code geladen und komme mit...
E

Estra

Member
Beiträge
10
Punkte Reaktionen
0
Hallo, ich bin ganz neu im Forum….habe angefangen mit einem html-online-kurs….
ich habe mir als Programm Visual Studio Code geladen und komme mit diesem Programm sehr gut klar.
bisher hat alles prima geklappt…
nun möchte ich gerne ein Bild in meine Seite einfügen. Habe das Bild auch richtig abgespeichert und den richtigen Befehl mit dem Pfad eingegeben und erhalte nun immer nur ein kleines Quadrat in der Vorschau an der Stelle, wo ich es gerne plazieren möchte….
was könnte ich falsch machen oder fehlt was in den Einstellungen?
ich öffne mir die Vorschau immer in Google Chrome…
mein Pfad:
<img src=“Quelle des Bildes“>
bin für jeden Tipp dankbar
 
S

scatello

Well-known member
Beiträge
309
Punkte Reaktionen
22
Wenn ein kleines Quadrat angezeigt wird, wird die Grafik-Datei nicht gefunden. Mehr kann man mit den Informationen nicht sagen.
 
S

Sempervivum

Well-known member
Beiträge
274
Punkte Reaktionen
42
Hallo Estra,
es gibt eine ganze Reihe von Gründen warum ein Bild nicht gefunden wird:
Erst mal sind in deinem Posting die Gänsefüßchen falsch, aber da Du schreibst, dass Du VS-Code benutzt, vermute ich eher, dass das beim Posten passiert ist.

den richtigen Befehl mit dem Pfad eingegeben
Wie sieht denn dieser Pfad genau aus? Wenn die Bilddatei im selben Verzeichnis wie die HTML-Datei liegt, brauchst Du nur den Dateinamen anzugeben.
Näheres zum Referenzieren bzw. der Angabe von Pfaden siehe hier:
https://wiki.selfhtml.org/wiki/HTML...adangaben_relativ_zum_Basis-URI_referenzieren
In den meisten Fällen ist relative Adressierung am besten geeignet.
 
E

Estra

Member
Beiträge
10
Punkte Reaktionen
0
ja, also ich arbeite mit Visual Studio Code, da werden die Gänsefüsschen automatisch so gesetzt…
die Bilder sind im selben Verzeichnis wie die Seite aber mit eigenem Ordner (der Unterordner=Bilder)
<img src=“bilder/Bildname “>
allerdings habe ich dasselbe Problem wenn ich mit dem Windowseditor dem Onlinekurs folge:
alles sieht genauso aus, mein Ordner und auch die Befehle, alles klappt gut, nur das Bild wird da auch nicht geöffnet…wahrscheinlich muss das jemand live sehe…..Ferndiagnosen sind immer schwierig, aber Danke für die Antwort…..
 
S

Sempervivum

Well-known member
Beiträge
274
Punkte Reaktionen
42
Häng doch mal die HTML-Datei als Anhang an.
 
S

Sempervivum

Well-known member
Beiträge
274
Punkte Reaktionen
42
Nein, ich meine die HTML-Datei.
 
E

Estra

Member
Beiträge
10
Punkte Reaktionen
0
Also eben habe ich den Befehl mal im Windows Editor eingegeben, und siehe da, das Bild wurde angezeigt….
kopiere ich den Link und setze ihn genau so in VSN ein, klappt es nicht….der link ist in diesem Programm dann auch orange und nicht wie der Rest weiss:


<body>
<h1>Jacek Ansgar Rabinski<br>
Komponist<br>
Kammermusik in aussergewöhnlicher Besetzung</h1>

<img src="Jacek.jpg">
 
E

Estra

Member
Beiträge
10
Punkte Reaktionen
0
Also eben habe ich den Befehl mal im Windows Editor eingegeben, und siehe da, das Bild wurde angezeigt….
kopiere ich den Link und setze ihn genau so in VSN ein, klappt es nicht….der link ist in diesem Programm dann auch orange und nicht wie der Rest weiss:
<img src=“Dateiname (orange)“>
weiss nicht, ob das was besagt
Leider kann ich die Datei nicht anhängen….schreibe vom Ipad und komischerweise, wenn ich mein Forumkonto auf dem PC öffne, dann finde ich leider nur das, was ich geschrieben habe..unter erhaltene Reaktionen steht nur, dass ich bisher keine Reaktion erhalten habe…🤔
Und da kann ich dann nicht antworten
 
E

Estra

Member
Beiträge
10
Punkte Reaktionen
0
@scatello
leider nein, was mache ich falsch?
im Editor hat es so geklappt….
vielleicht bin ich heute einfach schon betriebsblind🤪
 
S

Sempervivum

Well-known member
Beiträge
274
Punkte Reaktionen
42
In Posting #5 schriebst Du, dass das Bild in einem Unterverzeichnis "bilder" liegt. In dem HTML, das Du zuletzt in Posting #10 und #12 gepostet hast, fehlt dieses jedoch.
 
Zuletzt bearbeitet:
E

Estra

Member
Beiträge
10
Punkte Reaktionen
0
oh, ich habe einen neuen Versuch beim Editor gestartet und habe einfach den Unterordner Bilder gelöscht und das Bild dann in dem Webseitenordner gespeichert….sorry, das hab ich nicht mitgeteilt, stimmt….im Editor hat der Pfad, wie oben gepostet, geklappt
Leider aber nicht in VS-Code Programm….
 
S

Sempervivum

Well-known member
Beiträge
274
Punkte Reaktionen
42
Wie schon geschrieben: Poste die HTML-Datei, die nicht funktioniert, mal als Anhang:
bild-nicht-gefunden.png
 
Zuletzt bearbeitet:
E

Estra

Member
Beiträge
10
Punkte Reaktionen
0
da müsste ich Dir ja meine gesamte Seite schicken....also jedenfalls weiss ich nicht, wie ich das hinbekomme.
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Jacek</title>
</head>
<body>
<h1>Jacek <br>
Komponist<br>
Kammermusik in aussergewöhnlicher Besetzung</h1>
<img src="Jacek.jpg">


</body>
</html>

habe dir mal den Teil kopiert mit dem Link zum Bild.
Das verrückte ist, wenn ich die Datei so, wie ich sie Dir kopiert habe in den Windows Editor einfüge und mir dann im Browser anzeigen lasse, dann ist das Bild vorhanden....
also kann der Befehl eigentlich nicht falsch sein.
 
S

scatello

Well-known member
Beiträge
309
Punkte Reaktionen
22
Wenn die Jpg-Datei im gleichen Verzeichnis wie die HTML-Datei ist, dann ist das richtig so. Es scheint ja auch nur ein Problem bei der Vorschau in VS-Code zu sein, vielleicht ein Konfigurationsproblem von VS-Code? Ich kann dir nicht viel dazu sagen, da ich VS-Code nicht benutzte.
 
E

Estra

Member
Beiträge
10
Punkte Reaktionen
0
ja, die jpg-Datei ist im selben Ordner
langsam denke ich tatsächlich, dass es an VS-Code liegt.
Welches andere Programm wäre denn noch empfehlenswert….es gibt so viele…
und ich fange erst gerade an mich mit html auseinanderzusetzen☺️
 
Thema:

Bild einfügen

Oben Unten