Hilfe:Icons einbinden: Unterschied zwischen den Versionen
Aus ZUM-Unterrichten
KKeine Bearbeitungszusammenfassung Markierung: 2017-Quelltext-Bearbeitung |
KKeine Bearbeitungszusammenfassung Markierung: 2017-Quelltext-Bearbeitung |
||
Zeile 40: | Zeile 40: | ||
<span class="fa fa-rocket fa-5x"></span> fa-5x | <span class="fa fa-rocket fa-5x"></span> fa-5x | ||
Die Icons können auch in Links eingebunden werden: | |||
<pre> | |||
[[Hauptseite|<span class="fa fa-rocket></span> Hauptseite]] | |||
[[Hauptseite|<span class="brainy hdg-space-shuttle></span> Hauptseite]] | |||
</pre> | |||
[[Hauptseite|<span class="fa fa-rocket></span> Hauptseite]] | |||
[[Hauptseite|<span class="brainy hdg-space-shuttle></span> Hauptseite]] |
Version vom 4. September 2018, 11:38 Uhr
Auf den Seiten von ZUM Unterrichten lassen sich zwei Icon-Sets einbinden. Zum einen FontAwesome (Version 4) und zum anderen Brainy Icons.
Beide Icon-Sets passen sich der Textgröße und Textfarbe des Elternelement an.
Font Awesome
Font Awesome Icns werden wird folgt eingebunden:
<span class="fa fa-rocket"></span>
Zu sehen ist Folgendes:
Um große Icons anzuzeigen, gibt es die Option die Zoomklassen fa-lg (33% vergrößert), fa-2x, fa-3x, fa-4x, oder fa-5x hinzuzufügen:
<span class="fa fa-rocket fa-lg"></span> fa-lg <span class="fa fa-rocket fa-2x"></span> fa-2x <span class="fa fa-rocket fa-3x"></span> fa-3x <span class="fa fa-rocket fa-4x"></span> fa-4x <span class="fa fa-rocket fa-5x"></span> fa-5x
fa-lg
fa-2x
fa-3x
fa-4x
fa-5x
Die Icons können auch in Links eingebunden werden:
[[Hauptseite|<span class="fa fa-rocket></span> Hauptseite]] [[Hauptseite|<span class="brainy hdg-space-shuttle></span> Hauptseite]]