LU01b - Verweise und Anker

Ich kann Verweise (Hyperlinks) in einer Webseite hinzufügen und anhand der Attribute (z.B. href, id) anpassen kann. HTML-Elemente/Tags sind <a>.
Ich kenne bei den Verweisen den Unterschied zwischen absoluter und relativer Verweis.
Ich kann Verweise syntaktisch korrekt erstellen und kann Merkmale und Eigenschaften für den korrekten Aufbau aufzählen.
Ich kenn den Zweck von lokalen Verweisen (Anker).
Ich kann lokale Verweise (Anker) korrekt erstellen.

Einen Link können Sie in HTML mit dem <a>-Element (a = anchor, deutsch: Anker) erstellen. Der Linktext (oder Verweistext) zwischen den <a>-Tags wird aktiviert, wenn das href-Attribut einen validen Wert hat.

Ein Linktext wird gewöhnlich vom Webbrowser (meistens in Blau) unterstrichen. Dies können Sie aber (wie immer) mit CSS jederzeit ändern.

<a href="http://www.bzz.ch">Bildungszentrum Zürichsee</a>

Die Verweise verbinden die losen Sammlungen von HTML-Dokumenten zu einer zusammenhängenden Webseite. Daraus lässt sich die sog. Navigation der Webseite erstellen. Bei einem Link zu einer anderen Seite derselben Webseite genügt es, die relative (statt der absoluten) URL anzugeben. Dazu später mehr.

Folgende in der Abbildung abgedruckte Verzeichnisstruktur sei als Beispiel gegeben.

Die Verlinkung für die Startseite, hier index.html, zu den anderen Seiten links.html, about.html und impressum.html sieht demnach in der Praxis wie folgt aus:

<!doctype html>
<html lang="de">
  <head>
    <title>Startseite - Blog</title>
    <meta charset="UTF-8">
  </head>
  <body>
    <nav>
      Blog |
      <a href="seiten/links.html">Links</a> |
      <a href="seiten/about.html">Über mich</a> |
      <a href="seiten/impressum.html">Impressum</a>
    </nav>
    <h1>Mein Blog</h1>
    <p>Neueste Berichte zu HTML</p>
  </body>
</html>

—

Natürlich müssen Sie auch die Links zu den anderen Seiten, also links.html, about.html und impressum.html anpassen. Dabei sollen die relativen URL angegeben werden. Bezogen auf die Seite links.html, würden die Angaben für das Attribut href wie folgt aussehen:

<!doctype html>
<html lang="de">
  <head>
    <title>Linksammlung</title>
    <meta charset="UTF-8">
  </head>
  <body>
    <nav>
      <a href="../index.html">Blog</a> |
      Links |
      <a href="about.html">Über mich</a> |
      <a href="impressum.html">Impressum</a>
    </nav> 
    <h1>Linksammlung</h1>
    <p>Interessante Linksammlung zu HTML-Themen</p>
  </body>
</html>

Über den Unterordner seiten navigieren Sie mit ../ (hier ../index.html) zum übergeordneten Ordner, wo sich index.html befindet. Die anderen beiden Dateien about.html, impressum.html befinden sich im selben Ordner wie links.html, daher reicht es aus, nur den Dateinamen anzugeben. Ähnlich müssen Sie auch die Dateien about.html und impressum.html verlinken.

Links zu anderen Webseiten werden genauso notiert wie die Links zu den Seiten derselben Webseite. Der Unterschied liegt in der absolute URL (also die Angabe der kompletten Adresse) im Attribut href.

<nav>
  <ul>
    <li><a href="http://www.w3.org/html/wg/drafts/html/master/">HTML 5.1 Nightly</a></li>
    <li><a href="http://www.w3.org/">W3C</a></li>
    <li><a href="http://www.whatwg.org/">WHATWG</a></li>
  </ul>
</nav>

Mit dem HTML-Attribut target=„_blank“ wird der Verweis in einem neuen Fenster oder Tab geöffnet wird. Ziel der Verwendung von target=„_blank“ ist den Besucher der Seite nicht zu verlieren, sondern die Seite offen zu lassen, damit er dort zurückkehrt, wenn er die Seite im neu geöffneten Fenster oder Tab gelesen hat.

  <a target="_blank" href="http://www.w3.org/">Link in einem neuen Fenster öffnen</a>

Würden Sie in diesem Beispiel den Linktext W3C aktivieren, würde die Zieladresse (hier: http://www.w3.org) hier tatsächlich in einem neuen Fenster oder Tab geöffnet und geladen werden. Ziel der Verwendung von target=„_blank“ ist natürlich vorrangig, den

E-Mail-Verweise beginnen bei href=„mailto:EMAIL-ADRESSE“. Damit wird die E‐Mail-Anwendung mit einer bestimmten E-Mail-Adresse geöffnet.

  <a href="mailto:hans.muster@beispiel.ch">E-Mail senden</a>

Telefon-Verweise beginnen bei href=„tel:NUMMER“. Damit wird die Nummer gewählt und angerufen. (Desktop z.B. Facetime oder Online-Telefonie)

  <a href="tel:044 123 45 67">E-Mail senden</a>

Das Attribut download ermöglicht Links als Downloadverweis hinzuzufügen und das unabhängig vom Inhaltstyp (MIME-Typ).

  <a href="dokument.pdf" download>Dokument herunterladen</a>

Nichts kann für den Besucher lästiger sein, als eine sehr lange wissenschaftliche Abhandlung eines speziellen Themas auf einer Webseite zu lesen und dabei sehr lange hoch- und herunterscrollen zu müssen, um zu einem speziellen Abschnitt zu gelangen. Für solche Fälle können Sie sogenannte Anker mit dem globalen Attribut id setzen, den Sie dann mit einem gewöhnlichen Link mit dem a-Element anspringen können. Vorbildlich werden solche Zielanker z. B. bei Wikipedia für das Inhaltsver- zeichnis eines Themas verwendet. Für eine Verlinkung zu einem bestimmten Bereich einer Webseite benötigen Sie nur:

einen Anker (Sprungmarke), den Sie mit dem Attribut id=„ankername“ erstellen. Zum Beispiel: <h1 id=„ankername“>Überschrift xyz</h1>
einen Link, der auf den Anker mit href=„#ankername“ verweist. Hierzu wird das Doppelkreuz-Zeichen # vor den Ankernamen geschrieben. Zum Beispiel: <a href=„#ankername“>Zur Überschrift xyz springen</a>

<!doctype html>
<html lang="de">
  <head>
    <title>Startseite - Blog</title>
    <meta charset="UTF-8">
  </head>
  <body>
  <h1 id="top">Inhaltsverzeichnis</h1>
<ul>
  <li><a href="#intro">Einführung in HTML</a></li>
  <li><a href="#syntax">Die Syntax von HTML</a></li>
  <li><a href="#versionen">Versionen von HTML</a></li>
  <li><a href="#techniken">Techniken rund um HTML</a></li>
  <li><a href="#praxis">Einstieg in die Praxis</a></li>
</ul>
<section>
	<h1 id="intro">Einführung in HTML</h1>
	<p>
		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam fringilla nisl id dui convallis ullamcorper. Mauris ligula nisi, volutpat placerat lobortis non, pellentesque in mi. Nam id posuere turpis. Nunc tincidunt orci vestibulum libero auctor, at vulputate augue dictum. Nulla facilisis, ligula at viverra consequat, ipsum neque semper libero, et porttitor neque leo ut dui. Sed eu magna facilisis, mollis eros sit amet, molestie tortor. Curabitur aliquet malesuada tortor, sed condimentum libero accumsan quis. Curabitur id pulvinar ex. Vivamus in commodo neque. Sed fermentum ante non metus volutpat, sit amet tincidunt mauris tempor. Phasellus fringilla nibh dolor, vel ullamcorper sapien vehicula a. Donec justo felis, mollis sed metus in, aliquam vehicula felis. Nulla auctor maximus dui in faucibus. Curabitur dolor felis, vestibulum et hendrerit ac, tempor sit amet lorem. Nam eget lorem volutpat, condimentum dolor maximus, tristique tellus. Sed placerat mi arcu, faucibus placerat nulla placerat non.
 
Aliquam sed ullamcorper nibh, in finibus felis. Aenean dolor leo, interdum a volutpat quis, porttitor ac sapien. Nulla posuere arcu quis felis ultricies, eget elementum turpis pellentesque. Aenean commodo id lorem sed sodales. In pretium viverra vestibulum. Phasellus felis ipsum, dictum nec nulla ac, maximus vulputate lacus. Donec sed leo egestas, efficitur eros eget, lobortis est. Curabitur volutpat pretium lorem, in maximus lectus congue nec. Ut dapibus augue eget dui maximus malesuada. Praesent vel urna dapibus, tristique elit et, vehicula velit. Aenean nec eros ullamcorper enim bibendum posuere vel nec velit. Cras hendrerit justo non dapibus rutrum. Nunc sed lorem in sem malesuada semper eu ac ligula. Praesent sagittis bibendum nisl at euismod.
 
Sed vehicula aliquam tortor, ac scelerisque eros dignissim eu. Nulla rutrum turpis a nulla eleifend, nec rhoncus diam lacinia. Sed interdum, odio id semper maximus, erat mauris suscipit leo, nec egestas nibh ante quis dolor. Vivamus in ex ut sem hendrerit ullamcorper. Duis tristique nisi sit amet interdum pulvinar. Mauris sed urna sollicitudin, pharetra massa sit amet, posuere felis. Nunc eros velit, dictum in quam sed, vehicula rutrum nunc. Suspendisse facilisis et quam eu mattis.
 
Aliquam vitae porttitor massa, quis imperdiet lorem. Mauris accumsan rutrum finibus. Aliquam placerat, quam non dictum cursus, lacus elit tincidunt tortor, in scelerisque turpis lorem congue augue. Nullam sed ex placerat, vestibulum arcu ut, ultrices purus. Aliquam in sagittis purus, sed mollis lorem. Morbi commodo cursus tortor eget viverra. Etiam lobortis leo sit amet lorem efficitur pellentesque. Praesent non tristique turpis. Nam auctor mi non tincidunt mattis. Aliquam sit amet dui sed nibh volutpat rutrum nec ac quam. Nulla aliquet nisl id ligula malesuada ultricies ac non ante.
 
Nulla non est vitae nisl sodales pellentesque ac ac sapien. Aliquam iaculis luctus tempor. Etiam bibendum pharetra risus sed iaculis. Nunc varius justo non justo rutrum tincidunt. Aliquam volutpat, eros quis finibus convallis, nisl dolor faucibus orci, vel mattis urna eros nec urna. Cras accumsan, sem quis ultrices iaculis, nisl dolor ornare nulla, vitae interdum nulla massa a diam. Donec feugiat turpis quis mi interdum viverra. Vivamus pulvinar vitae metus sit amet egestas. Phasellus ac ultrices sem. Cras ut pretium erat. Etiam fermentum sodales bibendum. Nullam mattis velit ipsum, eu pharetra tellus faucibus ac. Cras orci nisi, molestie quis viverra a, tempor ac ex. Aliquam et mi nibh.
	</p>
	<p><a href="#top">Zum Inhaltsverzeichnis</a></p>	
</section>
 
<section>
<h2 id="syntax">Die Syntax von HTML</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam fringilla nisl id dui convallis ullamcorper. Mauris ligula nisi, volutpat placerat lobortis non, pellentesque in mi. Nam id posuere turpis. Nunc tincidunt orci vestibulum libero auctor, at vulputate augue dictum. Nulla facilisis, ligula at viverra consequat, ipsum neque semper libero, et porttitor neque leo ut dui. Sed eu magna facilisis, mollis eros sit amet, molestie tortor. Curabitur aliquet malesuada tortor, sed condimentum libero accumsan quis. Curabitur id pulvinar ex. Vivamus in commodo neque. Sed fermentum ante non metus volutpat, sit amet tincidunt mauris tempor. Phasellus fringilla nibh dolor, vel ullamcorper sapien vehicula a. Donec justo felis, mollis sed metus in, aliquam vehicula felis. Nulla auctor maximus dui in faucibus. Curabitur dolor felis, vestibulum et hendrerit ac, tempor sit amet lorem. Nam eget lorem volutpat, condimentum dolor maximus, tristique tellus. Sed placerat mi arcu, faucibus placerat nulla placerat non.
 
Aliquam sed ullamcorper nibh, in finibus felis. Aenean dolor leo, interdum a volutpat quis, porttitor ac sapien. Nulla posuere arcu quis felis ultricies, eget elementum turpis pellentesque. Aenean commodo id lorem sed sodales. In pretium viverra vestibulum. Phasellus felis ipsum, dictum nec nulla ac, maximus vulputate lacus. Donec sed leo egestas, efficitur eros eget, lobortis est. Curabitur volutpat pretium lorem, in maximus lectus congue nec. Ut dapibus augue eget dui maximus malesuada. Praesent vel urna dapibus, tristique elit et, vehicula velit. Aenean nec eros ullamcorper enim bibendum posuere vel nec velit. Cras hendrerit justo non dapibus rutrum. Nunc sed lorem in sem malesuada semper eu ac ligula. Praesent sagittis bibendum nisl at euismod.
 
Sed vehicula aliquam tortor, ac scelerisque eros dignissim eu. Nulla rutrum turpis a nulla eleifend, nec rhoncus diam lacinia. Sed interdum, odio id semper maximus, erat mauris suscipit leo, nec egestas nibh ante quis dolor. Vivamus in ex ut sem hendrerit ullamcorper. Duis tristique nisi sit amet interdum pulvinar. Mauris sed urna sollicitudin, pharetra massa sit amet, posuere felis. Nunc eros velit, dictum in quam sed, vehicula rutrum nunc. Suspendisse facilisis et quam eu mattis.
 
Aliquam vitae porttitor massa, quis imperdiet lorem. Mauris accumsan rutrum finibus. Aliquam placerat, quam non dictum cursus, lacus elit tincidunt tortor, in scelerisque turpis lorem congue augue. Nullam sed ex placerat, vestibulum arcu ut, ultrices purus. Aliquam in sagittis purus, sed mollis lorem. Morbi commodo cursus tortor eget viverra. Etiam lobortis leo sit amet lorem efficitur pellentesque. Praesent non tristique turpis. Nam auctor mi non tincidunt mattis. Aliquam sit amet dui sed nibh volutpat rutrum nec ac quam. Nulla aliquet nisl id ligula malesuada ultricies ac non ante.
 
Nulla non est vitae nisl sodales pellentesque ac ac sapien. Aliquam iaculis luctus tempor. Etiam bibendum pharetra risus sed iaculis. Nunc varius justo non justo rutrum tincidunt. Aliquam volutpat, eros quis finibus convallis, nisl dolor faucibus orci, vel mattis urna eros nec urna. Cras accumsan, sem quis ultrices iaculis, nisl dolor ornare nulla, vitae interdum nulla massa a diam. Donec feugiat turpis quis mi interdum viverra. Vivamus pulvinar vitae metus sit amet egestas. Phasellus ac ultrices sem. Cras ut pretium erat. Etiam fermentum sodales bibendum. Nullam mattis velit ipsum, eu pharetra tellus faucibus ac. Cras orci nisi, molestie quis viverra a, tempor ac ex. Aliquam et mi nibh.</p>
<p><a href="#top">Zum Inhaltsverzeichnis</a></p>
</section>
 
 
<section>
<h2 id="versionen">Versionen von HTML</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam fringilla nisl id dui convallis ullamcorper. Mauris ligula nisi, volutpat placerat lobortis non, pellentesque in mi. Nam id posuere turpis. Nunc tincidunt orci vestibulum libero auctor, at vulputate augue dictum. Nulla facilisis, ligula at viverra consequat, ipsum neque semper libero, et porttitor neque leo ut dui. Sed eu magna facilisis, mollis eros sit amet, molestie tortor. Curabitur aliquet malesuada tortor, sed condimentum libero accumsan quis. Curabitur id pulvinar ex. Vivamus in commodo neque. Sed fermentum ante non metus volutpat, sit amet tincidunt mauris tempor. Phasellus fringilla nibh dolor, vel ullamcorper sapien vehicula a. Donec justo felis, mollis sed metus in, aliquam vehicula felis. Nulla auctor maximus dui in faucibus. Curabitur dolor felis, vestibulum et hendrerit ac, tempor sit amet lorem. Nam eget lorem volutpat, condimentum dolor maximus, tristique tellus. Sed placerat mi arcu, faucibus placerat nulla placerat non.
 
Aliquam sed ullamcorper nibh, in finibus felis. Aenean dolor leo, interdum a volutpat quis, porttitor ac sapien. Nulla posuere arcu quis felis ultricies, eget elementum turpis pellentesque. Aenean commodo id lorem sed sodales. In pretium viverra vestibulum. Phasellus felis ipsum, dictum nec nulla ac, maximus vulputate lacus. Donec sed leo egestas, efficitur eros eget, lobortis est. Curabitur volutpat pretium lorem, in maximus lectus congue nec. Ut dapibus augue eget dui maximus malesuada. Praesent vel urna dapibus, tristique elit et, vehicula velit. Aenean nec eros ullamcorper enim bibendum posuere vel nec velit. Cras hendrerit justo non dapibus rutrum. Nunc sed lorem in sem malesuada semper eu ac ligula. Praesent sagittis bibendum nisl at euismod.
 
Sed vehicula aliquam tortor, ac scelerisque eros dignissim eu. Nulla rutrum turpis a nulla eleifend, nec rhoncus diam lacinia. Sed interdum, odio id semper maximus, erat mauris suscipit leo, nec egestas nibh ante quis dolor. Vivamus in ex ut sem hendrerit ullamcorper. Duis tristique nisi sit amet interdum pulvinar. Mauris sed urna sollicitudin, pharetra massa sit amet, posuere felis. Nunc eros velit, dictum in quam sed, vehicula rutrum nunc. Suspendisse facilisis et quam eu mattis.
 
Aliquam vitae porttitor massa, quis imperdiet lorem. Mauris accumsan rutrum finibus. Aliquam placerat, quam non dictum cursus, lacus elit tincidunt tortor, in scelerisque turpis lorem congue augue. Nullam sed ex placerat, vestibulum arcu ut, ultrices purus. Aliquam in sagittis purus, sed mollis lorem. Morbi commodo cursus tortor eget viverra. Etiam lobortis leo sit amet lorem efficitur pellentesque. Praesent non tristique turpis. Nam auctor mi non tincidunt mattis. Aliquam sit amet dui sed nibh volutpat rutrum nec ac quam. Nulla aliquet nisl id ligula malesuada ultricies ac non ante.
 
Nulla non est vitae nisl sodales pellentesque ac ac sapien. Aliquam iaculis luctus tempor. Etiam bibendum pharetra risus sed iaculis. Nunc varius justo non justo rutrum tincidunt. Aliquam volutpat, eros quis finibus convallis, nisl dolor faucibus orci, vel mattis urna eros nec urna. Cras accumsan, sem quis ultrices iaculis, nisl dolor ornare nulla, vitae interdum nulla massa a diam. Donec feugiat turpis quis mi interdum viverra. Vivamus pulvinar vitae metus sit amet egestas. Phasellus ac ultrices sem. Cras ut pretium erat. Etiam fermentum sodales bibendum. Nullam mattis velit ipsum, eu pharetra tellus faucibus ac. Cras orci nisi, molestie quis viverra a, tempor ac ex. Aliquam et mi nibh.</p>
<p><a href="#top">Zum Inhaltsverzeichnis</a></p>
</section>
 
<section>
<h2 id="techniken">Technik rund um HTML</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam fringilla nisl id dui convallis ullamcorper. Mauris ligula nisi, volutpat placerat lobortis non, pellentesque in mi. Nam id posuere turpis. Nunc tincidunt orci vestibulum libero auctor, at vulputate augue dictum. Nulla facilisis, ligula at viverra consequat, ipsum neque semper libero, et porttitor neque leo ut dui. Sed eu magna facilisis, mollis eros sit amet, molestie tortor. Curabitur aliquet malesuada tortor, sed condimentum libero accumsan quis. Curabitur id pulvinar ex. Vivamus in commodo neque. Sed fermentum ante non metus volutpat, sit amet tincidunt mauris tempor. Phasellus fringilla nibh dolor, vel ullamcorper sapien vehicula a. Donec justo felis, mollis sed metus in, aliquam vehicula felis. Nulla auctor maximus dui in faucibus. Curabitur dolor felis, vestibulum et hendrerit ac, tempor sit amet lorem. Nam eget lorem volutpat, condimentum dolor maximus, tristique tellus. Sed placerat mi arcu, faucibus placerat nulla placerat non.
 
Aliquam sed ullamcorper nibh, in finibus felis. Aenean dolor leo, interdum a volutpat quis, porttitor ac sapien. Nulla posuere arcu quis felis ultricies, eget elementum turpis pellentesque. Aenean commodo id lorem sed sodales. In pretium viverra vestibulum. Phasellus felis ipsum, dictum nec nulla ac, maximus vulputate lacus. Donec sed leo egestas, efficitur eros eget, lobortis est. Curabitur volutpat pretium lorem, in maximus lectus congue nec. Ut dapibus augue eget dui maximus malesuada. Praesent vel urna dapibus, tristique elit et, vehicula velit. Aenean nec eros ullamcorper enim bibendum posuere vel nec velit. Cras hendrerit justo non dapibus rutrum. Nunc sed lorem in sem malesuada semper eu ac ligula. Praesent sagittis bibendum nisl at euismod.
 
Sed vehicula aliquam tortor, ac scelerisque eros dignissim eu. Nulla rutrum turpis a nulla eleifend, nec rhoncus diam lacinia. Sed interdum, odio id semper maximus, erat mauris suscipit leo, nec egestas nibh ante quis dolor. Vivamus in ex ut sem hendrerit ullamcorper. Duis tristique nisi sit amet interdum pulvinar. Mauris sed urna sollicitudin, pharetra massa sit amet, posuere felis. Nunc eros velit, dictum in quam sed, vehicula rutrum nunc. Suspendisse facilisis et quam eu mattis.
 
Aliquam vitae porttitor massa, quis imperdiet lorem. Mauris accumsan rutrum finibus. Aliquam placerat, quam non dictum cursus, lacus elit tincidunt tortor, in scelerisque turpis lorem congue augue. Nullam sed ex placerat, vestibulum arcu ut, ultrices purus. Aliquam in sagittis purus, sed mollis lorem. Morbi commodo cursus tortor eget viverra. Etiam lobortis leo sit amet lorem efficitur pellentesque. Praesent non tristique turpis. Nam auctor mi non tincidunt mattis. Aliquam sit amet dui sed nibh volutpat rutrum nec ac quam. Nulla aliquet nisl id ligula malesuada ultricies ac non ante.
 
Nulla non est vitae nisl sodales pellentesque ac ac sapien. Aliquam iaculis luctus tempor. Etiam bibendum pharetra risus sed iaculis. Nunc varius justo non justo rutrum tincidunt. Aliquam volutpat, eros quis finibus convallis, nisl dolor faucibus orci, vel mattis urna eros nec urna. Cras accumsan, sem quis ultrices iaculis, nisl dolor ornare nulla, vitae interdum nulla massa a diam. Donec feugiat turpis quis mi interdum viverra. Vivamus pulvinar vitae metus sit amet egestas. Phasellus ac ultrices sem. Cras ut pretium erat. Etiam fermentum sodales bibendum. Nullam mattis velit ipsum, eu pharetra tellus faucibus ac. Cras orci nisi, molestie quis viverra a, tempor ac ex. Aliquam et mi nibh.</p>
<p><a href="#top">Zum Inhaltsverzeichnis</a></p>
</section>
 
<section>
<h2 id="praxis">Einstieg in die Praxis</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam fringilla nisl id dui convallis ullamcorper. Mauris ligula nisi, volutpat placerat lobortis non, pellentesque in mi. Nam id posuere turpis. Nunc tincidunt orci vestibulum libero auctor, at vulputate augue dictum. Nulla facilisis, ligula at viverra consequat, ipsum neque semper libero, et porttitor neque leo ut dui. Sed eu magna facilisis, mollis eros sit amet, molestie tortor. Curabitur aliquet malesuada tortor, sed condimentum libero accumsan quis. Curabitur id pulvinar ex. Vivamus in commodo neque. Sed fermentum ante non metus volutpat, sit amet tincidunt mauris tempor. Phasellus fringilla nibh dolor, vel ullamcorper sapien vehicula a. Donec justo felis, mollis sed metus in, aliquam vehicula felis. Nulla auctor maximus dui in faucibus. Curabitur dolor felis, vestibulum et hendrerit ac, tempor sit amet lorem. Nam eget lorem volutpat, condimentum dolor maximus, tristique tellus. Sed placerat mi arcu, faucibus placerat nulla placerat non.
 
Aliquam sed ullamcorper nibh, in finibus felis. Aenean dolor leo, interdum a volutpat quis, porttitor ac sapien. Nulla posuere arcu quis felis ultricies, eget elementum turpis pellentesque. Aenean commodo id lorem sed sodales. In pretium viverra vestibulum. Phasellus felis ipsum, dictum nec nulla ac, maximus vulputate lacus. Donec sed leo egestas, efficitur eros eget, lobortis est. Curabitur volutpat pretium lorem, in maximus lectus congue nec. Ut dapibus augue eget dui maximus malesuada. Praesent vel urna dapibus, tristique elit et, vehicula velit. Aenean nec eros ullamcorper enim bibendum posuere vel nec velit. Cras hendrerit justo non dapibus rutrum. Nunc sed lorem in sem malesuada semper eu ac ligula. Praesent sagittis bibendum nisl at euismod.
 
Sed vehicula aliquam tortor, ac scelerisque eros dignissim eu. Nulla rutrum turpis a nulla eleifend, nec rhoncus diam lacinia. Sed interdum, odio id semper maximus, erat mauris suscipit leo, nec egestas nibh ante quis dolor. Vivamus in ex ut sem hendrerit ullamcorper. Duis tristique nisi sit amet interdum pulvinar. Mauris sed urna sollicitudin, pharetra massa sit amet, posuere felis. Nunc eros velit, dictum in quam sed, vehicula rutrum nunc. Suspendisse facilisis et quam eu mattis.
 
Aliquam vitae porttitor massa, quis imperdiet lorem. Mauris accumsan rutrum finibus. Aliquam placerat, quam non dictum cursus, lacus elit tincidunt tortor, in scelerisque turpis lorem congue augue. Nullam sed ex placerat, vestibulum arcu ut, ultrices purus. Aliquam in sagittis purus, sed mollis lorem. Morbi commodo cursus tortor eget viverra. Etiam lobortis leo sit amet lorem efficitur pellentesque. Praesent non tristique turpis. Nam auctor mi non tincidunt mattis. Aliquam sit amet dui sed nibh volutpat rutrum nec ac quam. Nulla aliquet nisl id ligula malesuada ultricies ac non ante.
 
Nulla non est vitae nisl sodales pellentesque ac ac sapien. Aliquam iaculis luctus tempor. Etiam bibendum pharetra risus sed iaculis. Nunc varius justo non justo rutrum tincidunt. Aliquam volutpat, eros quis finibus convallis, nisl dolor faucibus orci, vel mattis urna eros nec urna. Cras accumsan, sem quis ultrices iaculis, nisl dolor ornare nulla, vitae interdum nulla massa a diam. Donec feugiat turpis quis mi interdum viverra. Vivamus pulvinar vitae metus sit amet egestas. Phasellus ac ultrices sem. Cras ut pretium erat. Etiam fermentum sodales bibendum. Nullam mattis velit ipsum, eu pharetra tellus faucibus ac. Cras orci nisi, molestie quis viverra a, tempor ac ex. Aliquam et mi nibh.</p>
<p><a href="#top">Zum Inhaltsverzeichnis</a></p>
</section>
 
 
</body>
</html>