Heim >Web-Frontend >CSS-Tutorial >Wie erstelle ich eine feste Kopf- und Fußzeile mit scrollbarem Inhalt?
Wie erstelle ich eine feste Kopf- und Fußzeile mit scrollbarem Inhalt?
- Linda HamiltonOriginal
- 2024-12-04 03:12:10389Durchsuche
Feste Kopf- und Fußzeile mit scrollbarem Inhalt: Eine Minimallösung
Eine feste Kopf- und Fußzeile mit scrollbarem Inhalt ahmt das Layout auf Websites nach wie das im referenzierten Bild. Hier ist ein minimaler CSS- und HTML-Codeausschnitt, der diesen Effekt erzielen kann:
HTML:
<html> <body>
CSS:
- #header legt fest, dass die Kopfzeile oben auf der Seite mit einer definierten Höhe und Breite fixiert wird. overflow:hidden verhindert, dass der Inhalt über die Kopfzeile hinausläuft.
- #content definiert den scrollbaren Inhaltsbereich, der unterhalb der Kopfzeile positioniert ist und sich bis zum Ende der Seite erstreckt.
- #footer ist am fixiert Unten auf der Seite, mit einer ähnlichen Höhe und Überlaufeigenschaft wie die Kopfzeile.
Das obige ist der detaillierte Inhalt vonWie erstelle ich eine feste Kopf- und Fußzeile mit scrollbarem Inhalt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Wie kann ich mit jQuery browserübergreifende CSS-Rotationsanimationen erzielen?Nächster Artikel：Wie kann ich mit jQuery browserübergreifende CSS-Rotationsanimationen erzielen?