Fügen Sie einen Link zu einem Bild in HTML hinzu

Autor: Christy White
Erstelldatum: 12 Kann 2021
Aktualisierungsdatum: 1 Juli 2024
Anonim
Hohe Mieten, leere Häuser - Haben Hausbesetzer*innen Recht? | STRG_F
Video: Hohe Mieten, leere Häuser - Haben Hausbesetzer*innen Recht? | STRG_F

Inhalt

Mit einer einzigen Zeile HTML-Code können Sie fast jeder Website ein anklickbares Bild hinzufügen. Es gibt zwei Dinge, die Sie benötigen, damit dies funktioniert. Sie benötigen eine URL für das Bild sowie die URL einer Website.

Schreiten

Methode 1 von 2: Schreiben Sie den HTML-Code

  1. Erstellen Sie eine HTML-Datei. Öffnen Sie einen Texteditor und erstellen Sie eine neue Datei. Speichern Sie die Datei als index.html.
      • Sie können jeden gewünschten Texteditor verwenden, auch die einfachen Texteditoren von Windows (Notepad) und Mac OS X (TextEdit).
      • Wenn Sie einen Texteditor für die Arbeit mit HTML verwenden möchten, klicken Sie hier, um Atom herunterzuladen, einen Texteditor für Windows, Mac OS X und Linux.
      • Wenn Sie TextEdit verwenden, klicken Sie vor dem Erstellen der HTML-Datei auf das Menü Format und dann auf Nur Text erstellen. Diese Einstellung stellt sicher, dass die HTML-Datei in einem Webbrowser korrekt geladen wird.
      • Textverarbeitungsprogramme wie Microsoft Word eignen sich nicht wirklich zum Schreiben von HTML, da sie unsichtbare Zeichen und Formatierungen hinzufügen, die die HTML-Datei beschädigen und sie in einem Webbrowser falsch anzeigen können.
  2. Kopieren Sie den Standard-HTML-Code und fügen Sie ihn ein. Wählen Sie den folgenden HTML-Code aus, kopieren Sie ihn und fügen Sie ihn in Ihre geöffnete index.html ein.

    a href = "Ziel-URL"> img src = "Bild-URL" /> / a>

  3. Finden Sie die URL Ihres Bildes. Suchen Sie ein Bild im Web, klicken Sie mit der rechten Maustaste darauf und klicken Sie (abhängig von Ihrem Browser) auf Bild-URL kopieren, Bildadresse kopieren oder Bildspeicherort kopieren.
      • Firefox und Internet Explorer verwenden den Speicherort für das Kopieren von Bildern. Chrome verwendet die URL zum Kopieren von Bildern. Safari verwendet Bildadresse kopieren.
  4. Fügen Sie die URL des Bildes hinzu. Klicken und ziehen Sie in der Datei index.html mit der Maus, um die URL des Bildes auszuwählen, und drücken Sie dann STRG + V, um die URL einzufügen.
  5. Fügen Sie die Ziel-URL hinzu. Löschen Sie in index.html die Ziel-URL und geben Sie sie ein https://www.startpage.com.
      • Sie können eine beliebige URL als Ziel-URL verwenden.
  6. Speichern Sie die HTML-Datei.
  7. Öffnen Sie die HTML-Datei in einem Webbrowser. Klicken Sie mit der rechten Maustaste auf index.html und öffnen Sie diese Datei im Webbrowser Ihrer Wahl.
      • Wenn der Browser geöffnet wird, Sie das Bild jedoch nicht sehen, stellen Sie sicher, dass Sie den Namen der Bilddatei in der Datei index.html richtig geschrieben haben.
      • Wenn der Browser geöffnet wird, aber anstelle des Hintergrundbilds HTML-Code angezeigt wird, wird Ihre index.html als RTF-Datei (Rich-Text-Datei) gespeichert. Versuchen Sie, die HTML-Datei in einem anderen Texteditor zu bearbeiten.

Methode 2 von 2: HTML-Code verstehen

  1. Verstehen Sie das Ankertag. HTML-Code besteht aus dem Öffnen und Schließen von Tags. Das Tag a href = ""> ist das Start-Tag und / a> ist das End-Tag. Dies wird als Ankertag bezeichnet und zum Hinzufügen von Links zu einer Webseite verwendet.
    • Das ein Weist einen Browser an, einen Link zu erstellen. Das href ist eine Abkürzung für HTML-Referenz, die = weist den Browser an, alles zwischen zu ändern ’ ’ Erstellen Sie einen Link. Zwischen den beiden Anführungszeichen kann eine beliebige URL eingefügt werden.
    • Das / a> teilt dem Browser mit, dass das Ankertag geschlossen ist.
    • Wenn Sie Text zwischen hinzufügen a href = ""> und / a> Dieser Text wird zu einem anklickbaren Link auf einer Webseite. Beispielsweise: a href = "https://www.google.com"> Google / a> erstellt einen Link zu Google.
  2. Verstehen Sie das Bild-Tag. Das img> -Tag ist ein geschlossenes Tag. Sie können es mit img src = "" /> oder img src = ""> / img> schließen.
    • Das img Tag weist einen Browser an, ein Bild anzuzeigen. Das src ist eine Abkürzung für source, de = weist den Browser an, alles zwischen dem zu löschen ’ ’ und rufen Sie das Bild von diesem Ort ab.
    • Das /> Weist einen Browser an, das Bild-Tag zu schließen.
    • Beispiel: {samp [} ruft das Bild von dieser URL ab und zeigt es dann in einem Webbrowser an.
  3. Verwenden Sie diesen Code überall. Jetzt, wo Sie diesen Code kennen, können Sie a href = "Ziel-URL"> img src = "Bild-URL" /> / a> zum Hinzufügen von anklickbaren Bildern zu jeder Webseite mit HTML-Code.