# Semantischen Tag

### Seitenleiste

- Menü1
- Menü2
- Menü3

# Hauptüberschrift

CSS mit den semantischen Tag ist nicht ganz leicht

Aber die Studenten sind sehr lernfähig

Das Layout ist momentan noch überschaubar

In den nächsten Beispielen wird es schwerer

Details
Diese Summary/Details-Technik wurde über Java-Skript realisiert.
hier ist der HTML:Quellcode:
<img src="Detail-white.png" alt="Version of the detail-element" border="0" onmousedown="details('idDetail');" /> Details<br />
<div id="idDetail" style="display:none">

### 2. Seitenleiste

- Menü4
- Menü5
- Menü6

# 2. Hauptüberschrift

CSS mit den semantischen Tag ist nicht ganz leicht

Aber die Studenten sind sehr lernfähig

Das Layout ist momentan noch überschaubar

In den nächsten Beispielen wird es schwerer

# 3. Java-Skript-Code

`<script type="text/javascript">
"use strict"
function details(sId) {
"use strict"
var element = document.getElementById(sId);
if ( element.style.display == 'none' )
element.style.display = 'block';
else
element.style.display = 'none';
} // details
</script>
`