Heim >Web-Frontend >CSS-Tutorial >Wie erstelle ich mit HTML und CSS eine feste Kopf- und Fußzeile mit scrollbarem Inhalt?
Wie erstelle ich mit HTML und CSS eine feste Kopf- und Fußzeile mit scrollbarem Inhalt?
- Linda HamiltonOriginal
- 2024-12-02 12:16:11933Durchsuche
Feste Kopf- und Fußzeile mit scrollbarem Inhalt
Die Implementierung einer festen Kopf- und Fußzeile mit scrollbarem Inhalt kann mit dem folgenden Mindest-HTML und CSS erreicht werden Code.
<html> <body>
body {
height: 100%;
width: 100%;
}
#header {
position: absolute;
top: 0px;
left: 0px;
height: 200px;
right: 0px;
overflow: hidden;
}
#content {
position: absolute;
top: 200px;
bottom: 200px;
left: 0px;
right: 0px;
overflow: auto;
}
#footer {
position: absolute;
bottom: 0px;
height: 200px;
left: 0px;
right: 0px;
overflow: hidden;
}
Dieser HTML- und CSS-Code erstellt eine feste Kopf- und Fußzeile mit einem scrollbarer Inhaltsbereich in der Mitte. Die Kopf- und Fußzeile haben eine feste Höhe, während der Inhaltsbereich vertikal gescrollt werden kann.
Das obige ist der detaillierte Inhalt vonWie erstelle ich mit HTML und CSS eine feste Kopf- und Fußzeile mit scrollbarem Inhalt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!