Zum Hinzufügen von Bildern in Markdown:
Die Syntax ist unten angegeben.
Zum Ändern der Bildgröße in Markdown:
Um die Größe des Bildes in Markdown zu ändern, verwenden wir das „ “-Tag des HTML. Nur dieses Tag hilft beim Ändern der Bildgröße in Markdown, und die Syntax dieses „
“-Tags ist unten angegeben.
< Bild Quelle = 'Bildname' alles = '' Breite = 'Wert' Höhe = 'Wert' >
Wir können die Größe des Bildes ändern, indem wir die Werte für Breite und Höhe sowohl in Zahlen als auch in Prozent angeben. Wir können auch das style-Attribut in diesem „ “-Tag verwenden, um die Größe des Bildes in Markdown zu ändern.
Beispiel # 01:
Wir verwenden den Visual Studio Code zum Ausführen der Markdown-Codes. Für die Markdown-Codes müssen wir sowohl den Texteditor als auch das Vorschaufenster öffnen. Im Texteditor müssen wir die Eingabe hinzufügen und die Ausgabe erhalten Sie im Vorschaufenster. Im Texteditor fügen wir zunächst das Bild in Markdown ein, indem wir das „!“ setzen. Symbol und fügen dann eckige Klammern hinzu, in denen wir „Alt-Text“ hinzufügen. Jetzt fügen wir den Pfad des Bildes hinzu.
Wir geben den Namen des Bildes mit seiner Erweiterung ein, da sowohl der Code als auch das Bild im selben Verzeichnis gespeichert sind. Also fügen wir hier einfach den Namen „cloud.png“ hinzu. Dann fügen wir den Text „Wolkenbild“ hinzu und das ist der Text, der nur angezeigt wird, wenn die Maus darüber bewegt wird. Jetzt wird das Bild hinzugefügt und wir können dieses Bild auch im Vorschaufenster sehen.
Das Wolkenbild wird unten gezeigt, da wir dieses Bild in den Markdown-Code eingefügt haben, der oben angezeigt wird.
Beispiel # 02:
Jetzt ändern wir die Größe dieses Bildes mit dem Tag „ “. Zuerst tragen wir die „src“ ein, in der der Name oder Pfad des Bildes hinzugefügt wird. Danach platzieren wir „alt“ und passen „Cloud Image“ an. Wir haben die „Breite“ des Bildes auf „230“ eingestellt. Die „Höhe“ ist auf „300“ eingestellt. Wir fügen auch den „Titel“ in dieses „
“-Tag ein und der Wert dieses „Titels“ ist „Cloud-Titel“. Jetzt wird die Größe des Bildes geändert. Sie können die geänderte Größe des Bildes im Vorschaufenster sehen.
Die Größe des Bildes in diesem Ergebnis wird geändert und die „Breite“ des Bildes ist „230“ und die „Höhe“ ist „300“. Dies liegt daran, dass wir diese Breite und Höhe im Markdown-Code angepasst haben.
Beispiel # 03:
Wir können auch die „Breite“ und „Höhe“ des Bildes ändern, indem wir ihre Werte in Prozent eingeben. Nachdem wir den Namen oder Pfad des Bildes hinzugefügt und „alt“ auf „Wolkenbild“ eingestellt haben, haben wir die „Breite“ und die „Höhe“ des Bildes auf „50 %“ gesetzt. Fügen Sie dann den „Titel“ hinzu und schließen Sie dieses Tag.
Hier ist das Bild, dessen Größe mithilfe des Tags „ “ geändert wird. Die Höhe des Bildes sowie die Breite betragen „50 %“.
Beispiel # 04:
Jetzt verwenden wir das „style“-Attribut in diesem „ “-Tag, um die Größe des Bildes in Markdown zu ändern. Wir müssen den Namen des Bildes und dann das Attribut „alt“ hinzufügen. Danach setzen wir das Attribut „Stil“ und fügen „Breite und Höhe“ als Werte hinzu. Die von uns festgelegte „Breite“ ist in Pixeln angegeben, also „500 Pixel“, und die „Höhe“ beträgt „400 Pixel“. Nun wird die Bildgröße entsprechend angepasst.
Die Bildgröße in diesem Ergebnis wurde aktualisiert; seine „Breite“ beträgt jetzt „500 Pixel“ und seine „Höhe“ beträgt „400 Pixel“. Dies wird durch den oben angegebenen Markdown-Code sichtbar, bei dem wir die Breite und Höhe im Stilattribut angepasst haben.
Beispiel # 05:
Wir fügen ein weiteres Bild hinzu. Aber in diesem Markdown-Code ändern wir die Größe des Bildes nicht. Die Größe des Bildes wird nur geändert, wenn wir das „ “-Tag verwendet haben. Wir setzen das '!' und fügen Sie dann den Text in den eckigen Klammern hinzu, der „Sonnenbild“ ist. Nachdem wir die eckigen Klammern geschlossen haben, setzen wir die Klammern, in die wir den Bildnamen „New_sun.png“ eingefügt haben, und fügen dann den Text hinzu, der bei Mouseover angezeigt wird. Die Originalgröße des Bildes wird im Ergebnis angezeigt.
Das Bild der Sonne wird angezeigt, da wir dieses Bild im Markdown-Code hinzugefügt haben. Außerdem ist die Originalgröße des Bildes sichtbar, da wir die Größe des Bildes nicht ohne die Verwendung des „ “-Tags anpassen können.
Beispiel # 06:
Durch die Verwendung des „ “-Tags ändern wir nun die Größe dieses Bildes. Zuerst fügen wir den Namen oder Pfad des Bildes, dessen Größe wir ändern möchten, in das Feld „src“ ein. Die „Breite“ und „Höhe“ des Bildes wurde beide auf „300“ geändert. Die Größe des Bildes hat sich jetzt geändert. Das Vorschaufenster zeigt die neue Größe des Bildes.
Die Breite und Höhe des Bildes wurden beide auf „300“ geändert.
Beispiel Nr. 07:
Indem wir die „Breite“- und „Höhe“-Werte des Bildes in Prozent einstellen, können wir diese Abmessungen leicht ändern. Wir haben beide die „Breite“ und „Höhe“ des Bildes auf „40 %“ angepasst und dann dieses Tag geschlossen.
Hier ist das Bild mit 40 % Höhe und ebenfalls 40 % Breite. Wir haben diese Breite und Höhe innerhalb des „ “-Tags hinzugefügt, nachdem wir den Namen des Bildes hinzugefügt haben.
Beispiel # 08:
Jetzt verwenden wir das „style“-Attribut im „ “-Tag, um die Bildgröße in Markdown zu ändern. Wir haben „Breite und Höhe“ als Werte zum „Stil“-Attribut hinzugefügt, nachdem wir den Bildnamen und das „Alt“-Attribut hinzugefügt haben. Die „Breite“, die wir angeben, ist „450 Pixel“, während die „Höhe“ ebenfalls auf „450 Pixel“ eingestellt ist. Die Bildgröße ändert sich nun entsprechend diesen neuen Breiten- und Höhenwerten.
Das Ergebnis dieses Codes wird nun auch im Vorschaufenster angezeigt, das unten angezeigt wird. Sowohl die Breite als auch die Höhe dieses Bildes sind jetzt „450px“ in diesem Ergebnis unten.
Fazit:
Wir haben das Konzept des Hinzufügens von Bildern in diesem Handbuch ausführlich untersucht und auch untersucht, wie Sie die Größe des Bildes in Markdown ändern können. Wir haben die Bilder in Markdown hinzugefügt und ihre Größe mit Hilfe des „ “-Tags geändert und gezeigt, wie man das alles in Markdown macht. Wir haben die Größe des Bildes geändert, indem wir die Werte für Breite und Höhe sowohl in Zahlen als auch in Prozent angegeben haben. Wir haben auch das style-Attribut im „
“-Tag verwendet, um die Größe des Bildes in Markdown zu aktualisieren oder zu ändern.