Beispiel:Position-sticky-2.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

<!DOCTYPE html> <html lang="de"> <head> 

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" media="screen" href="./Beispiel:Grundlayout.css">  
 <style>

h2 { 

 background: #337599;
 border-bottom: thin solid #113;
 border-top: thin solid #113;
 color: #fff;
 margin: 0;
 padding: 2px 0 0 12px;
 position: sticky;
 top: -1px;

} h2:nth-of-type(even) { 

  background: #c82f04;

}

.orte { 

 max-height: 22em;
 overflow: auto;
 border: thin solid;

}

</style> 

 <title>position: sticky - 2</title>

</head> <body>

position: sticky

Scroll dich du die shcönsten Orte Deutschlands.

<section class="orte">

A

  • Aachen
  • Aalen
  • Achim
  • Albstadt
  • Amberg
  • Ansbach
  • Arnsberg
  • Aschaffenburg
  • Augsburg

B

  • Baden-Baden
  • Bamberg
  • Bayreuth
  • Berlin
  • Bielefeld
  • Bocholt
  • Bochum
  • Bonn
  • Bottrop
  • Braunschweig
  • Bremen
  • Bremerhaven

C

  • Castrop-Rauxel
  • Celle
  • Chemnitz
  • Clausthal-Zellerfeld
  • Coburg
  • Cochem
  • Coesfeld
  • Cottbus

D

  • Dachau
  • Darmstadt
  • Deggendorf
  • Delmenhorst
  • Dessau-Roßlau
  • Detmold
  • Dinslaken
  • Dortmund
  • Dresden
  • Duisburg
  • Düren
  • Düsseldorf

E

  • Eberswalde
  • Eisenach
  • Eisenhüttenstadt
  • Elmshorn
  • Emden
  • Erfurt
  • Erlangen
  • Eschweiler
  • Esslingen am Neckar
  • Essen
  • Ettlingen

F

  • Fellbach
  • Flensburg
  • Forchheim
  • Frankenthal (Pfalz)
  • Frankfurt am Main
  • Frankfurt (Oder)
  • Freiberg
  • Freiburg im Breisgau
  • Freising
  • Freudenstadt
  • Fulda
  • Fürstenfeldbruck
  • Fürth

G

  • Garmisch-Partenkirchen
  • Gelsenkirchen
  • Gera
  • Germering
  • Gießen
  • Gifhorn
  • Gladbeck
  • Görlitz
  • Goslar
  • Gotha
  • Greifswald
  • Greven
  • Gummersbach
  • Günzburg

</section>

</body> </html>

Abgerufen am 19.07.2026
von "http://wiki.selfhtml.org/wiki/Beispiel:Position-sticky-2.html"