Header
Weitere Darstellungen für die Header-Navigation sind unter Menü zu finden.
Varianten
Header wien.gv.at "Angemeldet"
Link
Header wien.gv.at "Angemeldet" öffnen
Code
<wm-header>
<div>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
<form role="search">
<wm-input label="Suche" hideLabel="hideLabel" placeholder="Wie können wir helfen?" search="hiddenmobile"></wm-input>
</form>
<div>
<wm-button kind="clean">
<a href="#" class="wm-e-button wmheader_loginbutton">
<span class="wmheader_extramenubuttontext">Maria M.</span>
<wm-icon iconid="contact_notification"></wm-icon>
</a>
</wm-button>
</div>
<wm-nav-main type="hidden">
<a href="/nojs" class="fallback">
Menü
<svg width="26" height="26" viewBox="0 0 123.14 123.14" id="burger" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h123.14v123.14H0z"/><path d="M17.67 27.59h87v-6h-87zM17.67 58.57h87v6h-87zM17.67 95.49h87v6h-87z"/>
</svg>
</a>
<div slot="precontent">
<wm-stack horizontal="" gap="xs" alignment="center">
<wm-icon iconid="language"></wm-icon>
<wm-list type="horizontal" separator="pipe" gap="xxs">
<ul>
<li><a href="#">English</a></li>
<li><a href="#">Bosanski Hrvatski Srpski</a></li>
<li><a href="#">Türkçe</a></li>
</ul>
</wm-list>
</wm-stack>
</div>
<ul>
<li>
<a href="#">
<wm-icon iconid="home"></wm-icon>
Startseite
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="pin"></wm-icon>
Stadtplan
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="amtswege"></wm-icon>
Amtswege
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="contact"></wm-icon>
Kontakte
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="money"></wm-icon>
Jobs
</a>
</li>
</ul>
<ul>
<li>
<a href="#">
Freizeit
</a>
<ul>
<li>
<a href="#">
Veranstaltungen
</a>
</li>
<li>
<a href="#">
Baden
</a>
</li>
<li>
<a href="#">
Sport
</a>
<ul>
<li><a href="#">Übersicht</a></li>
<li><a href="#">Sportmöglichkeiten</a></li>
<li><a href="#">Kurse</a></li>
<li><a href="#">Vereine</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">
Wohnen
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Verkehr
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Bildung
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Gesundheit
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Umwelt
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Zusammenleben
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Stadtentwicklung
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Politik
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Wirtschaft
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
</ul>
<div>
<wm-list type="horizontal">
<ul>
<li><a href="https://facebook.com/wien.at" class="wm-no-external-icon" target="_blank"><wm-icon iconid="facebook">Facebook</wm-icon></a></li>
<li><a href="https://instagram.com/stadtwien" class="wm-no-external-icon" target="_blank"><wm-icon iconid="instagram">Instagram</wm-icon></a></li>
<li><a href="https://x.com/Stadt_Wien" class="wm-no-external-icon" target="_blank"><wm-icon iconid="twitter">X (Twitter)</wm-icon></a></li>
<li><a href="https://tiktok.com/@stadtwien" class="wm-no-external-icon" target="_blank"><wm-icon iconid="tiktok">TikTok</wm-icon></a></li>
<li><a href="https://youtube.com/channel/UCGLOly45we_1ZTXAXF7TZDA" class="wm-no-external-icon" target="_blank"><wm-icon iconid="youtube">YouTube</wm-icon></a></li>
<li><a href="https://www.wien.gv.at/bot/" class="wm-no-external-icon" target="_blank"><wm-icon iconid="wien-bot">Wienbot</wm-icon></a></li>
</ul>
</wm-list>
<p>
<a href="#">
<strong>NEWSLETTER</strong>
</a>
</p>
</div>
</wm-nav-main>
</div>
</wm-header>
Header wien.gv.at "Nicht angemeldet"
- Mit Logo, Suchfeld und Burgermenü
- Der Header bleibt beim Scrollen der Seite sichtbar. Das Logo verlinkt auf die Startseite wien.gv.at.
Link
Header wien.gv.at "Nicht angemeldet" öffnen
Code
<wm-header>
<div>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
<form role="search">
<wm-input label="Suche" hideLabel="hideLabel" placeholder="Wie können wir helfen?" search="hiddenmobile"></wm-input>
</form>
<div>
<wm-button kind="clean">
<a href="#" class="wm-e-button wmheader_loginbutton">
<span class="wmheader_extramenubuttontext">Anmelden</span>
<wm-icon iconid="contact_loggedin"></wm-icon>
</a>
</wm-button>
</div>
<wm-nav-main type="hidden">
<a href="/nojs" class="fallback">
Menü
<svg width="26" height="26" viewBox="0 0 123.14 123.14" id="burger" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h123.14v123.14H0z"/><path d="M17.67 27.59h87v-6h-87zM17.67 58.57h87v6h-87zM17.67 95.49h87v6h-87z"/>
</svg>
</a>
<div slot="precontent">
<wm-stack horizontal="" gap="xs" alignment="center">
<wm-icon iconid="language"></wm-icon>
<wm-list type="horizontal" separator="pipe" gap="xxs">
<ul>
<li><a href="#">English</a></li>
<li><a href="#">Bosanski Hrvatski Srpski</a></li>
<li><a href="#">Türkçe</a></li>
</ul>
</wm-list>
</wm-stack>
</div>
<ul>
<li>
<a href="#">
<wm-icon iconid="home"></wm-icon>
Startseite
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="pin"></wm-icon>
Stadtplan
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="amtswege"></wm-icon>
Amtswege
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="contact"></wm-icon>
Kontakte
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="money"></wm-icon>
Jobs
</a>
</li>
</ul>
<ul>
<li>
<a href="#">
Freizeit
</a>
<ul>
<li>
<a href="#">
Veranstaltungen
</a>
</li>
<li>
<a href="#">
Baden
</a>
</li>
<li>
<a href="#">
Sport
</a>
<ul>
<li><a href="#">Übersicht</a></li>
<li><a href="#">Sportmöglichkeiten</a></li>
<li><a href="#">Kurse</a></li>
<li><a href="#">Vereine</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">
Wohnen
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Verkehr
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Bildung
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Gesundheit
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Umwelt
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Zusammenleben
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Stadtentwicklung
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Politik
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
<li>
<a href="#">
Wirtschaft
</a>
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
</ul>
</li>
</ul>
<div>
<wm-list type="horizontal">
<ul>
<li><a href="https://facebook.com/wien.at" class="wm-no-external-icon" target="_blank"><wm-icon iconid="facebook">Facebook</wm-icon></a></li>
<li><a href="https://instagram.com/stadtwien" class="wm-no-external-icon" target="_blank"><wm-icon iconid="instagram">Instagram</wm-icon></a></li>
<li><a href="https://x.com/Stadt_Wien" class="wm-no-external-icon" target="_blank"><wm-icon iconid="twitter">X (Twitter)</wm-icon></a></li>
<li><a href="https://tiktok.com/@stadtwien" class="wm-no-external-icon" target="_blank"><wm-icon iconid="tiktok">TikTok</wm-icon></a></li>
<li><a href="https://youtube.com/channel/UCGLOly45we_1ZTXAXF7TZDA" class="wm-no-external-icon" target="_blank"><wm-icon iconid="youtube">YouTube</wm-icon></a></li>
<li><a href="https://www.wien.gv.at/bot/" class="wm-no-external-icon" target="_blank"><wm-icon iconid="wien-bot">Wienbot</wm-icon></a></li>
</ul>
</wm-list>
<p>
<a href="#">
<strong>NEWSLETTER</strong>
</a>
</p>
</div>
</wm-nav-main>
</div>
</wm-header>
<main></main>
Header wien.gv.at English
Link
Header wien.gv.at English öffnen
Code
<wm-header>
<div>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
<form role="search">
<wm-input label="Search" hideLabel="hideLabel" placeholder="What can we do for you?" search="hiddenmobile"></wm-input>
</form>
<wm-nav-main type="hidden" labelopen="Menu">
<a href="/nojs" class="fallback">
Menu
<svg width="26" height="26" viewBox="0 0 123.14 123.14" id="burger" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h123.14v123.14H0z"/><path d="M17.67 27.59h87v-6h-87zM17.67 58.57h87v6h-87zM17.67 95.49h87v6h-87z"/>
</svg>
</a>
<div slot="precontent">
<wm-stack vertical="" gap="s">
<wm-stack horizontal="" gap="xs" alignment="center">
<wm-icon iconid="contact_loggedin"></wm-icon>
<div><a href="#"><strong>Login</strong></a></div>
</wm-stack>
<wm-stack horizontal="" gap="xs" alignment="center">
<wm-icon iconid="language"></wm-icon>
<wm-list type="horizontal" separator="pipe" gap="xxs">
<ul>
<li><a href="#">Deutsch</a></li>
<li><a href="#">Bosanski Hrvatski Srpski</a></li>
<li><a href="#">Türkçe</a></li>
</ul>
</wm-list>
</wm-stack>
</wm-stack>
</div>
<ul>
<li>
<a href="#">
<wm-icon iconid="home"></wm-icon>
Homepage
</a>
</li>
<li>
<a href="#">
<wm-icon iconid="pin"></wm-icon>
Map
</a>
</li>
</ul>
<ul>
<li>
<a href="#">
Page
</a>
<ul>
<li>
<a href="#">
Subpage
</a>
</li>
<li>
<a href="#">
Subpage
</a>
</li>
<li>
<a href="#">
Subpage
</a>
<ul>
<li><a href="#">Subpage Level 2</a></li>
<li><a href="#">Subpage Level 2</a></li>
<li><a href="#">Subpage Level 2</a></li>
<li><a href="#">Subpage Level2</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">
Page
</a>
</li>
<li>
<a href="#">
Page
</a>
</li>
<li>
<a href="#">
Page
</a>
</li>
<li>
<a href="#">
Page
</a>
</li>
<li>
<a href="#">
Page
</a>
</li>
<li>
<a href="#">
Page
</a>
</li>
<li>
<a href="#">
Page
</a>
</li>
<li>
<a href="#">
Page
</a>
</li>
<li>
<a href="#">
Page
</a>
</li>
</ul>
<ul>
<li>
<a href="#">
Contact
</a>
</li>
<li>
<a href="#">
Jobs
</a>
</li>
<li>
<a href="#">
Media
</a>
</li>
</ul>
<div>
<wm-list type="horizontal">
<ul>
<li><a href="https://facebook.com" class="wm-no-external-icon"><wm-icon iconid="facebook">Facebook</wm-icon></a></li>
<li><a href="https://x.com" class="wm-no-external-icon"><wm-icon iconid="twitter">twitter</wm-icon></a></li>
<li><a href="https://youtube.com" class="wm-no-external-icon"><wm-icon iconid="youtube">youtube</wm-icon></a></li>
<li><a href="https://www.wien.gv.at/bot/" class="wm-no-external-icon"><wm-icon iconid="wien-bot">wienbot</wm-icon></a></li>
</ul>
</wm-list>
<p>
<a href="#">
NEWSLETTER
</a>
</p>
</div>
</wm-nav-main>
</div>
</wm-header>
Header Sonderauftritte "Minimal"
- Mit Seitentitel, Logo und Menüzeile
- Das Menü der Sonderseiten ist in einer der Markenfarben leicht (30 Prozent) eingefärbt, die Schrift ist Fast Schwarz. Das aufgeklappte Menü ist in einer der 6 Markenfarben zu 100 Prozent eingefärbt: Morgenrot, Flieder, Abendstimmung, Frischgrün, Goldgelb oder Nebelgrau. Die Schriftfarbe ist Fast Schwarz oder bei Abendstimmung ausnahmsweise Weiß.
- Das Logo verlinkt auf die Startseite von wien.gv.at, der Seitentitel auf die Startseite des jeweiligen Auftritts.
Link
Header Sonderauftritte "Minimal" öffnen
Code
<wm-header microsite color="morgenrot">
<div>
<a href="#">Seitentitel</a>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
</div>
<div>
<wm-nav-main microsite type="hiddenmobile">
<ol>
<li>
<a href="/#ebook">
eBook
</a>
<ol>
<li>
<a href="/#ebook">Übersicht</a>
</li>
<li>
<a href="/#ebook">eBook 1</a>
</li>
<li>
<a href="/#eBook">eBook 2</a>
</li>
<li>
<a href="/#emagazine">eBook 3</a>
</li>
</ol>
</li>
<li>
<a href="/#eaudio">
eAudio
</a>
<ol>
<li>
<a href="/#eaudio">
Übersicht</a>
</li>
<li>
<a href="/#ebook">eAudio 1</a>
</li>
<li>
<a href="/#eaudio">eAudio 2</a>
</li>
<li>
<a href="/#emagazine">eAudio 3</a>
</li>
</ol>
</li>
<li>
<a href="/#emagazine">
eMagazine
</a>
<ol>
<li>
<a href="/#emagazine">
Übersicht</a>
</li>
<li>
<a href="/#ebook">eMagazine 1</a>
</li>
<li>
<a href="/#eMagazine">eMagazine 2</a>
</li>
</ol>
</li>
<li>
<a href="/#ePaper">
ePaper
</a>
<ol>
<li>
<a href="/#ePaper">
Übersicht</a>
</li>
<li>
<a href="/#ebook">ePaper 1</a>
</li>
</ol>
</li>
<li>
<a href="/#eLlarning">
eLearning
</a>
<ol>
<li>
<a href="/#eLlarning">
Übersicht</a>
</li>
<li>
<a href="/#ebook">eLearning 1</a>
</li>
<li>
<a href="/#eLearning">eLearning 2</a>
</li>
<li>
<a href="/#emagazine">eLearning 3</a>
</li>
<li>
<a href="/#emagazine">eLearning 4</a>
</li>
<li>
<a href="/#emagazine">eLearning 5</a>
</li>
</ol>
</li>
</ol>
</wm-nav-main>
</div>
</wm-header>
Header Sonderauftritte "Alle Funktionen"
- Mit Sprachwahl, Login und Suche
- Wenn notwendig, Blur-Effekt bei zu vielen oder zu langen Menüpunkten. Ist alternativ über Burgermenü zu lösen.
Link
Header Sonderauftritte "Alle Funktionen" öffnen
Code
<wm-header microsite="microsite" color="frischgruen">
<div>
<a href="#">Seitentitel</a>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
</div>
<div>
<wm-nav-main microsite="microsite" type="hiddenmobile">
<ul>
<li><a href="#">Menüpunkt 1</a></li>
<li><a href="#">Menüpunkt 2</a></li>
<li><a href="#">Menüpunkt 3</a></li>
<li><a href="#">Menüpunkt 4</a></li>
<li><a href="#">Menüpunkt 5</a></li>
</ul>
</wm-nav-main>
<div>
<wm-button kind="clean" menu="block-end inline-end">
<button>
<span class="wmheader_extramenubuttontext">Maria M.</span>
<wm-icon iconid="contact_notification"></wm-icon>
</button>
<ul>
<li>
<button>Mein Profil</button>
</li>
<li>
<button>Abmelden</button>
</li>
</ul>
</wm-button>
<wm-button kind="clean" menu="block-end inline-end">
<button>
<span class="wmheader_extramenubuttontext">Sprache</span>
<wm-icon iconid="language"></wm-icon>
</button>
<ul>
<li>
<button>Deutsch</button>
</li>
<li>
<button>Englisch</button>
</li>
</ul>
</wm-button>
<div>
<form role="search">
<wm-input label="Suche" hideLabel="hideLabel" placeholder="Suche" search="hidden"></wm-input>
</form>
</div>
</div>
</div>
</wm-header>
Header Sonderauftritte "Suche"
Link
Header Sonderauftritte "Suche" öffnen
Code
<wm-header microsite="microsite" color="abendstimmung">
<div>
<a href="#">Seitentitel</a>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
</div>
<div>
<wm-nav-main type="hiddenmobile" microsite="microsite">
<ul>
<li><a href="#">Regierungsmonitor</a></li>
<li><a href="#">Stadtregierung</a></li>
<li><a href="#">Koalitionsprogramm</a></li>
</ul>
</wm-nav-main>
<div>
<form role="search">
<wm-input label="Suche" hideLabel="hideLabel" placeholder="Suche" search="hidden"></wm-input>
</form>
</div>
</div>
</wm-header>
Header Sonderauftritte "Suche mit Eingabefeld"
Alternative zur Suche mit Lupe
Link
Header Sonderauftritte "Suche mit Eingabefeld" öffnen
Code
<wm-header microsite="microsite" color="abendstimmung">
<div>
<a href="#">Seitentitel</a>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
</div>
<div>
<wm-nav-main type="hiddenmobile" microsite="microsite">
<ul>
<li><a href="#">Regierungsmonitor</a></li>
<li><a href="#">Stadtregierung</a></li>
<li><a href="#">Koalitionsprogramm</a></li>
</ul>
</wm-nav-main>
<form role="search">
<wm-input label="Suche" hideLabel="hideLabel" placeholder="Suche"></wm-input>
</form>
</div>
</wm-header>
Header Sonderauftritte "Angemeldet"
Link
Header Sonderauftritte "Angemeldet" öffnen
Code
<wm-header microsite color="morgenrot">
<div>
<a href="#">Seitentitel</a>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
</div>
<div>
<wm-nav-main microsite type="hiddenmobile">
<ol>
<li>
<a href="/#">
Mein Wien
</a>
</li>
<li>
<a href="/#">
Amtswege
</a>
</li>
</ol>
</wm-nav-main>
<div>
<wm-button kind="clean" menu="block-end inline-end">
<button>
<span class="wmheader_extramenubuttontext">Maria M.</span>
<wm-icon iconid="contact_loggedin"></wm-icon>
</button>
<ul>
<li>
<button>Mein Profil</button>
</li>
<li>
<button>Abmelden</button>
</li>
</ul>
</wm-button>
</div>
</div>
</wm-header>
Header Sonderauftritte "Angemeldet" mit Mitteilung
Link
Header Sonderauftritte "Angemeldet" mit Mitteilung öffnen
Code
<wm-header microsite color="morgenrot">
<div>
<a href="#">Seitentitel</a>
<a href="/">
<svg viewBox="0 0 311 142" width="80" role="img" aria-labelledby="site-logo1">
<title id="site-logo1">Startseite wien.gv.at</title>
<path fill="#FF0000" d="M55.3 53.6V15.3H14.2c0 13.3 1 26.2 2.9 38.3h38.2zM55.3 65.7h-36c6.9 32.7 20.2 57.1 36 62.2V65.7zM67.3 53.6V15.3h41.1c0 13.3-1 26.2-2.9 38.3H67.3zM67.3 65.7h36c-6.9 32.7-20.2 57.1-36 62.2V65.7z"></path>
<path fill="currentColor" d="M153.5 65.2c-2.4 0-4.7-.3-6.9-1s-4.4-1.7-6.6-3.1l1.3-8.4h.3c2.1 1.6 4.1 2.7 6.2 3.3 2.1.6 4 .9 5.7.9 5 0 7.5-1.9 7.5-5.6 0-1.3-.4-2.5-1.1-3.5-.7-1-2-2.1-3.8-3.1l-6-3.4c-3.5-1.9-5.9-4-7.4-6.2s-2.2-4.7-2.2-7.4c0-4.2 1.4-7.5 4.2-9.9 2.8-2.4 6.6-3.6 11.3-3.6 4.3 0 8.3 1.1 11.9 3.2l-1.3 8.1h-.3c-1.4-1-3-1.7-4.9-2.2-1.9-.5-3.6-.7-5.3-.7-4.4 0-6.6 1.7-6.6 5 0 1.2.4 2.3 1.1 3.3.8 1 2.2 2.1 4.4 3.3l5.3 2.9c3.3 1.8 5.8 3.8 7.3 6s2.3 4.8 2.3 7.8c0 4.5-1.5 8-4.5 10.6-2.8 2.5-6.8 3.7-11.9 3.7zM183.8 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6H188v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10zM209 64.6c-3.2 0-5.7-.8-7.5-2.5-1.9-1.7-2.8-4-2.8-7.1 0-3.1 1.1-5.5 3.2-7.3 2.2-1.8 5.1-2.8 8.8-3.2l9.1-.9v-.1c0-1.8-.5-3.1-1.5-4-1-.9-2.8-1.4-5.4-1.4-1.9 0-3.9.2-5.9.7-2 .5-3.6 1-4.8 1.6h-.4l1.3-7.7c1.4-.6 3.1-1 5.1-1.5 2-.4 4.2-.6 6.4-.6 4.9 0 8.5 1.1 10.8 3.4 2.3 2.3 3.4 5.6 3.4 10v10.4c0 1.7.1 3.4.4 5 .2 1.6.6 3 1.2 4.2v.4h-8.5c-.3-.6-.5-1.5-.7-2.4-.2-1-.3-1.9-.4-2.7h-.4c-.8 1.6-2.3 2.9-4.3 4s-4.4 1.7-7.1 1.7zm-1.1-10.3c0 1 .3 1.8.9 2.4.6.6 1.7 1 3.1 1 2.3 0 4.1-.7 5.6-2s2.2-3.1 2.2-5.2v-.8l-6.9.8c-1.7.2-3 .6-3.8 1.1-.7.6-1.1 1.5-1.1 2.7zM260.9 64v-4.9h-.4c-1 1.8-2.4 3.2-4.3 4.2s-4 1.5-6.4 1.5c-2.9 0-5.4-.7-7.6-2.1-2.2-1.4-3.9-3.4-5.1-6-1.2-2.6-1.8-5.6-1.8-9 0-3.4.6-6.4 1.8-9 1.2-2.6 2.9-4.5 5.1-6 2.2-1.4 4.7-2.1 7.6-2.1 2.2 0 4.2.4 6 1.3 1.8.9 3.2 2.1 4.2 3.6h.5V15.3h9.1V64h-8.7zm-8.1-7c2.5 0 4.4-.9 5.9-2.6 1.5-1.7 2.2-4 2.2-6.7 0-2.8-.7-5.1-2.2-6.7-1.5-1.7-3.5-2.5-5.9-2.5-2.5 0-4.5.8-5.9 2.5-1.5 1.6-2.2 3.9-2.2 6.8 0 2.8.7 5.1 2.2 6.7 1.4 1.6 3.3 2.5 5.9 2.5zM284.9 64c-1.6-2.2-2.7-4.6-3.5-7.4-.8-2.8-1.2-6-1.2-9.5V39h-5.7v-7.6h5.7v-9.7h9v9.7h7.7l-1.3 7.6h-6.4v7.4c0 3.7.5 6.9 1.5 9.6 1 2.7 2.4 5.3 4.3 7.6v.4h-10.1zM161.6 126.1h-11c-1.1-2.4-2.3-5.4-3.5-9-1.3-3.6-2.5-7.5-3.6-11.9-1.2-4.4-2.2-8.9-3.1-13.7-.9-4.7-1.5-9.4-1.8-14.1h9.9c.3 4.3.9 8.8 1.7 13.5.8 4.7 1.7 9.2 2.8 13.7 1.1 4.4 2.2 8.5 3.4 12.2h.5l9.9-33h7.3l9.9 33h.5c1.2-3.7 2.3-7.8 3.3-12.2 1-4.4 1.9-9 2.7-13.7.8-4.7 1.3-9.2 1.7-13.5h9.7c-.3 4.7-1 9.4-1.8 14.1-.9 4.7-1.9 9.3-3.1 13.7-1.2 4.4-2.4 8.3-3.6 11.9-1.3 3.6-2.4 6.6-3.5 9h-11l-8.2-27.4h-.7l-8.4 27.4zM213.1 88.3c-1.7 0-3.1-.5-4.2-1.6s-1.6-2.4-1.6-4 .5-3 1.6-4 2.5-1.6 4.2-1.6c1.7 0 3.1.5 4.2 1.6 1.1 1 1.6 2.4 1.6 4s-.5 2.9-1.6 4c-1.1 1-2.5 1.6-4.2 1.6zm-4.6 37.8V93.4h9.1v32.7h-9.1zM241.4 126.9c-3.6 0-6.6-.7-9.2-2.1-2.6-1.4-4.6-3.4-5.9-5.9-1.4-2.6-2.1-5.5-2.1-9 0-3.6.7-6.7 2.2-9.3 1.5-2.6 3.5-4.6 6-5.9 2.6-1.4 5.5-2.1 8.7-2.1 4.8 0 8.5 1.5 11.2 4.4 2.7 2.9 4 7 4 12.2v2l-22.5 2.5c.6 2 1.7 3.4 3.2 4.2 1.6.8 3.5 1.2 5.7 1.2 2.1 0 4.2-.3 6.4-.8 2.1-.6 3.7-1.2 4.8-1.9h.5l-1.3 7.8c-1.2.6-2.9 1.2-5.1 1.8-2.1.6-4.3.9-6.6.9zm-.5-27c-2 0-3.7.6-5 1.9-1.3 1.2-2.1 3.1-2.4 5.6l13.9-1.6c-.3-2-1-3.5-2.1-4.4-1.3-1-2.7-1.5-4.4-1.5zM262.6 126.1V93.4h8.2V99h.4c.8-1.9 2.2-3.4 4.1-4.6 1.9-1.1 4.1-1.7 6.6-1.7 3.8 0 6.8 1.3 9 3.8s3.3 6.1 3.3 10.6v19.1h-9.1v-17.9c0-5.1-2.1-7.7-6.3-7.7-2.1 0-3.8.8-5.1 2.3-1.3 1.5-1.9 3.5-1.9 6v17.3h-9.2z"></path>
</svg>
</a>
</div>
<div>
<wm-nav-main microsite type="hiddenmobile">
<ol>
<li>
<a href="/#">
Mein Wien
</a>
</li>
<li>
<a href="/#">
Amtswege
</a>
</li>
</ol>
</wm-nav-main>
<div>
<wm-button kind="clean" menu="block-end inline-end">
<button>
<span class="wmheader_extramenubuttontext">Maria M.</span>
<wm-icon iconid="contact_notification"></wm-icon>
</button>
<ul>
<li>
<button>Mein Profil</button>
</li>
<li>
<button>Abmelden</button>
</li>
</ul>
</wm-button>
</div>
</div>
</wm-header>
API
Abhängigkeiten
HTML
<script src="https://assets.wien.gv.at/theme/latest/js/components/Header/Header.js" type="module"></script>
JavaScript
import { Header } from './wienermelange/assets/js/components/Header/Header.js';
Eigenschaften
Eigenschaften
| Eigenschaft |
Beschreibung |
Werte |
Default |
color
|
Farbe der 2. Zeile im Header
|
'flieder'|'goldgelb'|'abendstimmung'|'morgenrot'|'frischgruen'|'wasserblau'
|
leer
|
Slots
| Name |
Beschreibung |
default
|
1 oder 2 divs
|
Methoden
| Eigenschaft |
Optionen |
Argumente |
addAction
|
Eine Action von außen hinzufügen
|
(Node)
|
CSS API
|
Property
|
Beschreibung
|
--header-actions-gap
|
Abstand zwischen Elementen in der 2. Zeile
|
--header-nav-level1-background-color
|
Hintergrundfarbe Navigation Level 1
|
--header-nav-level2-background-color
|
Hintergrundfarbe Navigation Level 2
|
--header-nav-level3-background-color
|
Hintergrundfarbe Navigation Level 3
|
--header-nav-flyout-background-color--desktop
|
Hintergrundfarbe Navigationsflyout (Desktop)
|
--header-nav-link-color
|
Schriftfarbe der Navigations-Links
|
--header-nav-flyout-link-color--desktop
|
Schriftfarbe der Navigations-Links im Navigationsflyout (Desktop)
|
Kontakt
Haben Sie noch Fragen, Feedback oder brauchen Sie ein Element, das die Pattern Library noch nicht
bietet?
handbuch@ma53.wien.gv.at