Ein CSS-Div auf 100 % Seitenhöhe strecken
Sie benötigen eine CSS-Lösung, um ein Div so zu strecken, dass es die gesamte Seitenhöhe umfasst, Einschließlich gescrollter Bereiche sucht diese Frage nach einem HTML/CSS-Ansatz, um diesen Effekt zu erzielen.
Die vorgestellte Lösung beinhaltet das Entfernen spezifischer CSS-Eigenschaften:
Zusätzlich wird das folgende CSS bereitgestellt:
<code class="css">html {
min-height: 100%;
position: relative;
}
body {
height: 100%;
}
#cloud-container {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
overflow: hidden;
z-index: -1; /* Remove for non-background uses */
}</code>Bei Implementierung zusammen mit dem folgenden HTML:
<code class="html"><!doctype html>
<html>
<body>
<div id="cloud-container"></div>
</body>
</html></code>Diese Lösung stellt sicher, dass die # Das Cloud-Container-Div nimmt die gesamte Höhe der Seite ein, einschließlich der gescrollten Bereiche. Die bereitgestellte Erklärung beleuchtet die Rolle der HTML-Eigenschaften „Mindesthöhe“ und „Position“ sowie die Art und Weise, wie der Z-Index, links/rechts und oben/unten angepasst werden können, um das gewünschte Ergebnis zu erzielen.
Das obige ist der detaillierte Inhalt vonWie lässt sich ein CSS-Div auf 100 % der Seitenhöhe ausdehnen, einschließlich gescrollter Bereiche?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
