Anki Flashcard (Teil 16)

So in Teil 15 habe ich die verschienden Platzhalter gezeigt, heute werde ich ein paar Formatierungsbeispiele für die Karten zeigen.

Wenn ihr eure Karten formatieren wollt benötigt ihr etwas HTML und CSS, dafür benötigt ihr keine besonderen Kenntnisse da eigentlich nur ein paar Befehle wirklich sinnvoll sind und der Rest zwar nutzbar, aber je nach Anwendungsfall nicht sinnvoll sind, da zwar viele Befehle zwar funktionieren, aber eben nicht müssen.

Am ehesten werdet ihr folgende Befehle benötigen:

  • <b></b> fetter Text
  • <strong></strong> fetter Text
  • <i></i> kursiver Text
  • <u></u> unterschrichener Text
  • <p></p> erzeugt einen Absatz
  • <div></div> erzeugt einen sogenannten Container, wird in Anki als Absatz gehandhabt, damit könnt ihr ganze Bereiche formatieren
  • <span></span> ähnlich wie <div> nur es wird kein Absatz erzeugt
  • <br /> erzeugt einen Zeilenumbruch

Das sind eigentlich wie wichtigsten Befehle, ihr schreibt eure Texte einfach zwischen die zwei Tags.

Über CSS könnt ihr das Aussehen etwas anpassen:

.card {
 font-family: Arial;
 font-size: 20px;
 text-align: center;
 color: black;
 background-color: white;
}

.card ist etwas das in Anki immer präsent ist, außerdem existieren noch .card1, .card2, u.s.w. damit könnt ihr dann theoretisch für jede Karte die Gestaltung etwas ändern.

Ich persönlich ändere nur die Hintergrundfarbe, damit ich weiß was ich genau Abfrage ohne auf den Titel schauen zu müssen.

Also zwischen die { und } könnt ihr z.B. font-family nehmen und eine Schriftart festlegen, über font-size die Schriftgröße (in px oder em (ist abhängig von der Einstellung)).
Allerdings möchte ich jetzt nicht zu tief in die Materie eingehen, da dass Thema CSS ziemlich komplex werden könnte und für viele Anwender wahrscheinlich auch uninteressant ist.

Für Anwender die nicht europäische Sprachen lernen und die entsprechende Schriftart nicht überall installieren möchten bzw. nicht können, die Schriftart kann als ttf im Mediaordner abgelegt werden, dafür muss diese aber unbedingt mit _ am Anfang sein, da Anki sonst keine Verknüpfung zu einer Karte findet und diese Datei wieder löschen würde.

@font-face {
 font-family: tami;
 src: url('_TakaoMincho.ttf');
}

Mit diesem CSS Code wird die gewünschte Schriftart geladen und kann dann überall auf der Notiz in font-family eingebunden werden. In diesem Beispiel wird die Schriftart als tami geladen, sprich ihr könnt diese dann z.B. bei .card { font-family: tami; } als Schriftart setzen.

Ok, dass war es für heute, bis zum nächsten Mal ツ

Kommentar hinterlassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.