#ePrdctn 7 – Listen in E-Books

Heute wollte ich eigentlich mal mehrere Antworten auf Google-Suchanfragen schnell hintereinander beantworten, doch dann blieb ich schon an der ersten hängen und habe gebastelt und – #hach – lest selbst…

Der Suchbegriff, mit dem jemand auf meine Seite kam, lautete „css-befehl für aufzählungszeichnen“

Die Frage hier lautet für mich zunächst, was der oder die Suchende meint.

Dazu sollte ich zwei Sätze zum grundsätlichen Verhältnis von HTML und CSS verlieren: HTML (das „M“ steht für „Markup“) zeichnet ein bestimmtes Element in deiner Datei als etwas aus. Besipielsweise wird ein bestimmter Abschnitt deines E-Books als Liste ausgezeichnet. CSS hingegen legt das Aussehen dieser ausgezeichneten Elemente fest (das erste „S“ steht für „Style“).

Wenn du, liebe/r Suchende/r also wissen wolltest, wie du Listen erstellst, so ist CSS die falsche Sprache dazu.
Stattdessen kannst du geordnete (ordered) Listen, also solche mit Ordnungszahlen, und ungeordnete (unordered) Listen, das sind die mit Aufzählungszeichen, in HTML auszeichnen.

Die Befehle sehen folgendermaßen aus:

<ul>
<li>ul bezeichnet die „unordered List“</li>
<li>li bzeichnet den Listenpunkt</li>
</ul>

oder eben:

<ol>
<li>ol steht dann für die „ordered List“</li>
<li>li hingegen hat die gleiche Bedeutung</li>
</ol>

Kleiner Grammatiknerdeinschub: Am Ende von Auzählungspunkten macht man keine Punkte. NIE! Vergesse ich aber dauernd…

Beide Arten der Listen werden auf jeden Fall unterstützt von ePub2, ePub3 und kf8. Bei mobi7 bin ich mir nicht ganz sicher, aber wer will denn auch noch mobi7 schreiben?

Wenn es dir hingegen tatsächlich um den Stil der Liste ging, dann stehst du zunächst einmal vor der Wahl, ob du das Aussehen deiner Listen universell oder doch lieber individuell festlegen möchtest.

Wenn du allen ordered lists den gleichen Stil zuweisen möchtest, lautet der Befehl, den du in die CSS-Datei eintragen musst, folgendermaßen:

ol {
list-style-type: upper-roman;
}

Wenn du hingegen ein Freund des Individualismus bist, musst du zunächst einmal Klassen vergeben. Deine ungeordnete Liste musst du etwa so benennen: <ul class=“smiley“>

Dann kannst du im CSS für jede Liste das Aussehen einzeln bestimmen:

ul.smiley {
list-style-image: url('smiley.png');
}

Wie dz siehst, habe ich einmal einen der vordefinierten Typen verwendet und einmal ein Bild als Aufzählungspunkt. Beide Varianten werden ganz sicher unterstützt von ePub2, ePub3 und kf8. Ich habe mir die Listen in einem halben Dutzend Readern angeguckt, bis auf Stanza lösten alle meine Listen mit dem fantastischen Smiley smiley problemlos auf.

Das Beispiel-E-Book habe ich wieder hier zur Verfügung gestellt.

Ausführlich aufgeschlüsselt, wie du Stile Listen zuweisen kannst, findest du hier.

Eine Auflistung der zulässigen Werte hingegen hier.

Viel Spaß!

Advertisements

Hinterlasse einen Kommentar

Eingeordnet unter #ePrdctn

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s