HTML - Element: <aside>

Der <aside>-Tag (HTML 5) definiert eigene Inhalte neben dem (Haupt-)Inhalt. Der Nebeninhalt sollte mit dem umgebenden Inhalt zusammenhängen.

<!DOCTYPE html>
<html>
<head>
 <title>Das Blindtextchen</title>
<style>
aside {
  width: 40%;
  padding-left: 20px;
  margin-left: 20px;
  float: right;
  font-style: italic;
  background-color: yellow;
}
</style>
</head>
<body>

<h1>Das Blindtextchen</h1>

<p>Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. 
Abgeschieden wohnen Sie in Buchstabhausen* an der Küste des Semantik, eines großen Sprachozeans.</p>

<aside>
<h4>Buchstabhausen*</h4>
<p>Buchstabhausen hat etwa 26000 Einwohner und wurde um 1450 gegründet.<br>
Buchstabhausen ist eine kreisfreier Ort im Regierungsbezirk Großbuchstaben und Standort des Landratsamtes Wortsalat. 
Buchstabhausen ist Universitäts-, Schul- und Verwaltungsstadt, wichtiges Wirtschaftszentrum ist Unterschriften sowie Sitz des 
gleichnamigen Erzbistums.</p>
</aside>

<p>Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien. 
Es ist ein paradiesmatisches Land, in dem einem gebratene Satzteile in den Mund fliegen. </p>

</body>
</html>

Beispiel anzeigen

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Codeschnipseln aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<figure> Abbildung

CSS - Eingabefelder und Buttons formatieren

PHP - Letztes Verzeichnis aus einer URL ermitteln

JavaScript - Bilder Zoom-Funktion

MySQL - Datensätze über Checkbox-Auswahl suchen

Inhalt mit Humor
Lockern Sie Ihre privaten Seiten mit Humor auf, das macht die Seite persönlicher. Einfügen von lustigen Bildern oder Text, auch hier gilt: Bitte nicht zu viel!