Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- moodle:html-formatierung [12.07.2024 14:30] – Marieke Röben
+++ moodle:html-formatierung [25.03.2025 14:51] (aktuell) – Marieke Röben
@@ Zeile 118: / Zeile 118: @@
 Um direkt auf eine E-Mail-Adresse zu verlinken, beginnen Sie wie bei einer normalen Webseite, setzen aber keine Anführungszeichen und ein //mailto:// vor die Emailadresse. Sie können hier einen Text anzeigen lassen anstelle der E-Mail-Adresse.\\
 Beispiel: ''<a href = mailto:beispiel@email.de> Beispieltext <a/>''
+??? Wie können Buttons mit hinterlegten Links erstellt werden?
+!!! Möchten Sie statt einem Link im Text direkt einen Button als Schaltfläche einsetzen, können Sie wie folgt vorgehen.\\
+Mit dem Befehl ''<button>'' fügen Sie eine Buttonschaltfläche ein und mit ''<a href= >'' können Sie den gewünschten Link im Button hinterlegen. Über einen eingegebenen Text zwischen ''<button>'' und ''</button>'' können Sie eine Beschriftung für diesen anzeigen. Dies könnte dann beispielsweise so aussehen:\\
+'' <a> Hier können Sie die Seite zur </a> <a href="https://www.leuphana.de/lehre.html"> <button> Lehre </button> </a> <a> öffnen. </a>''\\
+{{:playground:button_link.png?direct|}}
 ??? Kann ich verborgenen / ausklappbaren Text einbinden?
 !!! Möchten Sie einen einklappbaren Abschnitt innerhalb Ihres Textes einzufügen, verwenden Sie die beiden Befehle ''<details>'' und ''<summary>''. Sie beginnen mit ''<details>'', anschließend ''<summary> //Bezeichnung// </summary>'' für die Überschrift des einklappbaren Abschnitts. Nun nutzen Sie ''<p> //Abschnittsinhalte// </p>'' um den Inhalt des eingeklappten zu erstellen. Zum Schluss schließen Sie diesen Bereich mit ''</details>''\\
@@ Zeile 126: / Zeile 133: @@
 </details>
 ''
+===== Einbindung von Bildern =====
+??? Wie kann ich Bilder so einbinden, dass sie sich dem Kurslayout / der Breite der Darstellung anpassen?
+!!! Wenn Moodle-Kurse auf unterschiedlichen Geräten oder in unterschiedlichen Fenstergrößen/Zoomstufen angezeigt werden, kann es passieren, dass die Größe eingebundener Bilder nicht mehr zum Gesamtlayout passt. Zum Beispiel kann ein Header im Kachelformat bei schmaler Darstellung (drei Kacheln nebeneinander) über die gesamte Breite des Kurses gehen, bei breiterer Darstellung (fünf Kacheln nebeneinander) aber nur noch einen Teil der Gesamtbreite abdecken.
+{{moodle:moodle_bilder_prozentual_-_gegenueberstellung_pixel.png?direct&450}}
+Dies kann gelöst werden, indem die Breite der Grafik in Prozent statt in Pixeln angegeben wird. Das Bild skaliert dann mit dem Gesamtlayout des Kurses:
+{{moodle:moodle_bilder_prozentual_-_gegenueberstellung_prozent.png?direct&450}}
+Um diesen Effekt zu erreichen, geben Sie einfach beim Einfügen des Bildes die Größe in Prozent an:
+{{:moodle:moodle-bilder_prozentual.png?450}}
+Für Header, die sich über die gesamte Breite des Kurses erstrecken sollen, bietet sich eine Zahl von 80-100% an. Wenn Sie eine Grafik nur am Rand einbinden möchten, bietet sich eine schmalere Variante, z.B. von 25-35%, an.

Support Digitale Lehre

Benutzer-Werkzeuge

Webseiten-Werkzeuge

Unterschiede

Seiten-Werkzeuge