Fußnoten in HTML erstellen

Hin und wieder ist es Sinnvoll in HTML Dokumenten mit Fussnoten zu arbeiten. Dies ist nativ unter HTML nicht vorgesehen, deshalb muss man etwas tricksen und mit Ankern arbeiten.

Der Fußnote habe ich eine klasse zugeordnet <div class="footnotes"> um sie im CSS gesondert bearbeiten zu können.

So sieht der Code aus:

<p>In diesem Satz werde ich eine Fußnoten<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup> unterbringen. Dieser Satz enthält eine zweite Fußnote<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>.</p>
<div class="footnotes">
<hr>
<ol>
<li id="fn:1">
<p>Das ist die erste Fußnote.<a href="#fnref:1" rev="footnote">↩</a></p></li>
<li id="fn:2">
<p>Das ist die zweite Fußnote.<a href="#fnref:2" rev="footnote">↩</a></p></li>
</ol>
</div>

So sieht das Ergebniss aus:

In diesem Satz werde ich eine Fußnoten1 unterbringen. Dieser Satz enthält eine zweite Fußnote2.


  1. Das ist die erste Fußnote.

  2. Das ist die zweite Fußnote.

ps. Beim direkten kopieren des o.g. Codes in deinen Texteditor kann es zu leichten Konvertierungsproblemen kommen.

Veranstalltungshinweis: Linux Presentation Day

Linux Tux
Das Linux-Maskottchen „Tux“

Linux zum Anschauen und Anfassen – für Nicht-Linux-Nutzer

Mit der Absage des LinuxTags für 2015 ist Berlin seine einzige große Linux-Veranstaltung abhanden gekommen. Neben diesem ganz praktischen Grund, etwas Neues zu organisieren, gibt es Bedenken bezüglich der Zielgruppenorientierung des LinuxTags: Insbesondere die Veranstaltung 2014 erschien wenig geeignet, Nicht-Linux-Nutzer zwangslos und mit niedriger Hemmschwelle an das Thema heranzuführen.

Die Veranstaltung wird an zwei Tagen stattfinden, am 9. Mai (Samstag) und am 12. Mai (Dienstag). Aktuell acht Standorte in Berlin.

Weblink: http://www.linux-presentation-day.de/